jdi-testing / jdn-ai

JDN – is the Chrome plugin for UI test automation. It helps Software Test Automation Engineer to create Page Objects for the test automation framework and start test development fast
MIT License
9 stars 3 forks source link

[US-7-2] Inline editing #963

Open savinovava opened 1 year ago

savinovava commented 1 year ago

Locator is active (selected) AND a User LMC on text area of this locator WHEN inline editing (editing in the locators' list) starts (ex: file renaming in the Windows Explorer)

Meeting notes

Edit in the locators' list: @UI("//*[@id='mc_embed_signup_scroll']//div[3]") public TextField textfieldDiv;

Fields, that are available to be edited:


Figma, сверху дизайн, снизу доп экраны для прототипа Prototype


Наводим мышкой на редактируемую часть локатора, при наведении она подсвечивается как #FFD666 в высоту строки

@UI("//*[@class='MuiFormControl-root jss7']/div")  // тут редактируем то что в кавычках
public Select selectDiv114; //тут можем редактировать имя, то есть selectdiv114

нажимаем на область, после переходим в режим редактирования, меняется фон на #F5F5F5, остаётся жёлтая обводка (inside border, чтобы высота контейнера не увеличивалась) image

при нажатии Enter или при клике за границей контейнера редактирования - редактирование закрывается с сохранением при нажатии Esc редактирование закрывается с отменой image

после редактирования показываем такой же нотификейшн как и после стандартного редактирования, с возможностью отменить действие image


Сохранение и валидация

валидация будет происходить не с каждым символов, а по завершению редактирования

Для следующих ситуаций мы сохраняем с иконкой варнинга

По локатору:

  1. Пустое значение
  2. Локатор, по которому не найден элемент
  3. Новый нераспознанный раннее элемент

figma icon image

Для следующих ситуаций мы не даём сохранить и показываем ошибку

По имени:

  1. Уникальность
  2. Запрещенные символы/слова
  3. Нельзя оставлять пустым

По локатору:

  1. Дублирование (#1150)
  2. Нашлись несколько элементов по введенному локатору

При попытке сохранить меняем цвет обводки на (#FF4D4F) и показываем нотификацию Цвет возвращаем при любом редактировании текста. При нажатии на крестик нотификейшена не сбрасываем редактирование и тд, просто закрываем нотификейшн

figma image

(#997 если на момент выполнения ещё используются Alerts, то можно ими с красным фоном) figma

Снимок экрана 2023-06-05 в 13 39 18
SemyonKuznetsov commented 1 year ago

Figma, сверху дизайн, снизу доп экраны для прототипа Prototype


Наводим мышкой на редактируемую часть локатора, при наведении она подсвечивается как #FFD666 в высоту строки

@UI("//*[@class='MuiFormControl-root jss7']/div")  // тут редактируем то что в кавычках
public Select selectDiv114; //тут можем редактировать имя, то есть selectdiv114

нажимаем на область, после переходим в режим редактирования, меняется фон на #F5F5F5, остаётся жёлтая обводка (inside border, чтобы высота контейнера не увеличивалась) image

при нажатии Enter или при клике за границей контейнера редактирования - редактирование закрывается с сохранением при нажатии Esc редактирование закрывается с отменой image

после редактирования показываем такой же нотификейшн как и после стандартного редактирования, с возможностью отменить действие image


Сохранение и валидация

валидация будет происходить не с каждым символов, а по завершению редактирования

Для следующих ситуаций мы сохраняем с иконкой варнинга

По локатору:

  1. Пустое значение
  2. Локатор, по которому не найден элемент
  3. Новый нераспознанный раннее элемент

figma icon image

Для следующих ситуаций мы не даём сохранить и показываем ошибку

По имени:

  1. Уникальность
  2. Запрещенные символы/слова
  3. Нельзя оставлять пустым

По локатору:

  1. Дублирование (#1150)
  2. Нашлись несколько элементов по введенному локатору

При попытке сохранить меняем цвет обводки на (#FF4D4F) и показываем нотификацию Цвет возвращаем при любом редактировании текста. При нажатии на крестик нотификейшена не сбрасываем редактирование и тд, просто закрываем нотификейшн

figma image

(#997 если на момент выполнения ещё используются Alerts, то можно ими с красным фоном) figma

Снимок экрана 2023-06-05 в 13 39 18
SemyonKuznetsov commented 1 year ago

Надо чтобы посмотрел Алексей после отпуска