Local Storage Editor предоставя чист табличен интерфейс за управление на localStorage и sessionStorage записите за текущия сайт. Разглеждайте всички двойки ключ-стойност, редактирайте стойности инлайн, добавайте нови записи и изтривайте тези, които не ви трябват. JSON стойностите се разпознават автоматично и се форматират за лесно четене. Превключвайте между разделите localStorage и sessionStorage, за да управлявате двата типа хранилище.
Уеб приложенията съхраняват огромни количества състояние в localStorage и sessionStorage — потребителски предпочитания, токени за удостоверяване, флагове за функции, назначения за A/B тестове, съдържание на пазарски колички, чернови на формуляри, кеширани отговори от API и състояние на потребителския интерфейс. Дебъгването на тези стойности в Chrome DevTools изисква навигация до раздела Application, намиране на секцията Storage и използване на базов инструмент за преглед на ключ-стойност с ограничени възможности за редактиране. Local Storage Editor пренася това в специално създаден панел с превключване на хранилището чрез раздели, инлайн редактиране, автоматично JSON форматиране и групови операции. Таблицата показва всяка двойка ключ-стойност с името на ключа и неговата стойност. JSON стойностите (които са изключително разпространени — обекти, сериализирани с JSON.stringify) се разпознават автоматично и се показват с правилно форматиране и подчертаване на синтаксиса. Кликнете върху която и да е стойност, за да я редактирате на място — промените се записват в API за хранилище мигновено. Добавяйте нови записи чрез чист формуляр или изтривайте записи поотделно или групово.
Превключвайте между localStorage и sessionStorage с бутони за раздели в горната част на панела. Всеки раздел показва броя на записите (напр. „localStorage (12)“ / „sessionStorage (3)“). И двата типа хранилище се управляват от един интерфейс.
Кликнете върху която и да е клетка със стойност, за да я редактирате на място. За прости стойности въведете новия низ. За JSON стойности редакторът се разширява до форматирано текстово поле с подчертаване на синтаксиса. Промените се записват в API за хранилище мигновено.
JSON стойностите (обекти и масиви, сериализирани с JSON.stringify) се разпознават автоматично и се показват с правилни отстъпи и подчертаване на синтаксиса. Редактирайте форматирания JSON директно — той се сериализира повторно, когато запишете.
Кликнете върху „Add Entry“ (Добавяне на запис), за да създадете нова двойка ключ-стойност. Въведете името на ключа и неговата стойност (низ или JSON). Записът веднага се записва в localStorage или sessionStorage за текущия домейн.
Изтривайте отделни записи с бутона за изтриване на реда или използвайте „Clear All“ (Изчистване на всички), за да премахнете всеки запис за текущия тип хранилище. Полезно за нулиране на състоянието на приложението по време на тестване.
Промените, направени в редактора, се отразяват незабавно в приложението. Ако приложението чете стойност от localStorage при взаимодействие с потребителя, редактирането на тази стойност в панела променя това, което приложението чете следващия път — не е необходимо презареждане на страницата в повечето случаи.
Проверете какви стойности е съхранило вашето приложение в localStorage. Наличен ли е токенът за удостоверяване? Правилно ли е структуриран обектът за потребителски предпочитания? Дали остаряла кеширана стойност причинява неочаквано поведение?
Изчистете целия localStorage, за да нулирате приложението до първоначалното му състояние — полезно за тестване на първоначалното потребителско преживяване, онбординг потоци и конфигурации по подразбиране, без да изчиствате данните на браузъра за други сайтове.
Много приложения съхраняват стойности на функционални флагове в localStorage. Редактирайте ги директно, за да активирате или деактивирате функции, без да преминавате през потребителския интерфейс за управление на флагове или да внедрявате нов код.
Редактирайте съхранените потребителски предпочитания, настройки на темата, избори на език или флагове за завършване на онбординг, за да симулирате различни потребителски състояния и да тествате как приложението обработва всяко от тях.
Вижте какви данни съхраняват скриптове на трети страни (анализи, чат, реклама) в localStorage на вашия домейн. Направете одит на данните за съответствие с поверителността и неочаквано използване на хранилището.
Отворете плаващия док DevSuite Pro и щракнете върху иконата Local Storage Editor. Отваря се панел, показващ всички записи в localStorage за текущия домейн.
Превъртете таблицата ключ-стойност. JSON стойностите се форматират автоматично. Превключвайте разделите, за да видите sessionStorage вместо това.
Кликнете върху която и да е стойност, за да я редактирате инлайн. За JSON стойнисти се появява форматиран редактор. Промените се записват в API за хранилище мигновено.
Кликнете върху „Add Entry“, за да създадете нова двойка ключ-стойност. Кликнете върху иконата за изтриване на всеки ред, за да го премахнете. „Clear All“ изчиства всичко.
След редактиране на стойностите в хранилището, взаимодействайте със страницата, за да видите как приложението реагира на променените данни.
Инсталирайте DevSuite Pro безплатно и отключете 39+ инструмента за разработчици за вашия браузър.
