Сниппеты. Как сделать процесс работы с документацией проще


    Привет, Хабр! Меня зовут Павел Лесюк. Я тестировщик нативных мобильных приложений. В своей предыдущей статье я привел список инструментов, которые могут использоваться тестировщиками и некоторыми другими специалистами для повышения продуктивности своей работы.

    В новой серии статей я бы хотел рассмотреть некоторые инструменты поближе и показать на примерах их использование. Первая статья будет посвящена наиболее эффективному и простому решению — сниппетам.

    Сниппеты — это фрагменты текста (кода), которые сохраняются для последующего многократного использования. Сниппеты бывают трех видов: статические (обычный текст), динамические (с использованием переменных) и скриптовые (с использованием кода).

    В этой статье мы рассмотрим примеры создания статических и динамических сниппетов при работе с десктопом и мобильными приложениями. Помните, что сниппеты — это универсальный инструмент, который может использовать любой специалист, работающий с текстовой информацией.

    Инструменты для десктопа


    Весь процесс будем рассматривать на примере программы TextExpander для macOS. Есть версии под Windows, Chrome, iOS. Это наиболее функциональный инструмент. Стоимость: $4.16 ежемесячно или $3.33 в месяц при годовой подписке. В качестве альтернативы я бы советовал попробовать PhraseExpress. Есть версии для macOS, Windows, iOS, Android.

    В macOS есть встроенная автозамена. Найти ее можно по пути: «Настройки» → «Клавиатура» → «Текст».


    В ней поддерживается только обычный текст, так что ее можно использовать только для простых шаблонов.

    Заполнение отчетов о дефектах


    Допустим, мы хотим автоматизировать процесс создания отчетов о дефектах. Для начала создадим наиболее полный шаблон для заполнения описания в баг-трекинговой системе Jira. Будем учитывать то, что в будущем мы захотим создать все комбинации наиболее часто используемых полей для заполнения описания отчетов. Приступим.

    Создание группы сниппетов


    Сперва создадим группу сниппетов и присвоим ей название.

    Присваивание имени и аббревиатуры


    Теперь нужно создать новый сниппет, присвоить ему имя и аббревиатуру. Имя — идентификатор, с помощью которого можно быстро определить, что содержится в сниппете и найти его при необходимости. Аббревиатура — последовательность символов, при вводе которых будет вставляться содержимое сниппета.

    Вот несколько свойств хороших аббревиатур:

    1. Имеет префикс. Это свойство лучше всего использовать, если у вас настроено раскрытие сразу после ввода аббревиатуры (об этом далее). Если выбрать аббревиатуру «report», то с большой вероятностью эта последовательность символов рано или поздно попадется вам в стандартном режиме печати. Поэтому нужно использовать такую последовательность, которую вы не напечатаете до тех пор, пока вам не понадобится содержимое сниппета. Например, можно добавить запятую. Так как после запятой в стандартном режиме печати ставится пробел, то «,report» вам не попадется. Хорошая практика — использовать один префикс для всех сниппетов в одной группе.
    2. Уникальная. Это свойство также действует если у вас настроено раскрытие сниппета сразу после ввода. Аббревиатура не должна содержать в себе аббревиатуру другого сниппета, так как это приведет к конфликту имен. Например, если у нас есть сниппет «,bg», и мы захотим вставить сниппет «,bg2», то до ввода «2» сработает вставка первого сниппета.
    3. Запоминаемая. Это значит, что последовательность символов должна ассоциироваться с сутью сниппета или быть аббревиатурой его имени. Например, для нашего кейса мы можем выбрать имя «Bug report» и аббревиатуру «,report» или «,bg».
    4. Короткая. Длинная аббревиатура будет труднее запоминаться и занимать больше времени на набор.

    В большинстве случаев я предпочитаю использовать наименования и аббревиатуры на английском языке. Первый сниппет назовем «Environment, preconditions, steps, actual and expected result» (помним, то что мы захотим создать еще несколько комбинаций этих параметров, поэтому такое название я считаю наиболее подходящим). Аббревиатура — «,epsae», что соответствует первым буквам слов в названии. Также можно настроить чувствительность к регистру.

    Заполнение сниппета


    Заполним сниппет контентом для описания отчета.

    Мы создали статический сниппет. Символы «*» и «#» — синтаксис форматирования в Jira (жирный и нумерованный список соответственно). Посмотрим как работает вставка.


    Намного лучше, чем вводить все это вручную или искать нужный шаблон в заметках, не правда ли? В настройках можно задать параметры вставки сниппета. Вставка может происходить сразу после ввода или после нажатия клавиши-ограничителя.

    Таким же образом можем создать шаблоны для всех используемых комбинаций полей в описании отчета о дефекте. Можно создать именно тот набор шаблонов, который мы будем использовать чаще всего.

    Например, у меня этот набор выглядит следующим образом:

    • Preconditions, steps, actual and expected result
    • Preconditions, actual and expected result
    • Steps, actual and expected result
    • Actual and expected result

    Использование динамических элементов


    Рассмотрим еще несколько примеров.

    Например, мне нужно быстро вшить ссылку в текст при оформлении отчета. При использовании встроенного инструмента в Jira это выглядит так:


    Вроде неплохо, мы можем сразу начать печатать. Но что, если я хочу вместо example.com вставлять уже скопированную ссылку из буфера обмена? Для этого нам понадобится возможность создания динамического контента внутри сниппета.

    С помощью динамических элементов мы вставляем скопированный в буфер обмена контент и устанавливаем курсор в нужную нам позицию. Посмотрим как работает вставка.


    Теперь усовершенствуем наш первый шаблон. Допустим, вы мобильный тестировщик, у вас есть парк мобильных устройств, часть которого закреплена за вами. Вы тестируете на этих устройствах чаще всего, и вам хотелось бы иметь их список под рукой при оформлении отчета о дефекте.

    Для начала создадим список устройств. Сделаем это с использованием опциональных для выбора элементов.

    Далее создадим список хостов, на которых проводим тестирование. Добавим в нашу группу новый сниппет и снова используем опциональные элементы.

    Отлично! Теперь перейдем к нашему основному сниппету и обогатим его контентом.

    Мы добавили вставку опциональных элементов из других сниппетов и установили позицию курсора, чтобы можно было сразу приступить к вводу текста. Посмотрим как работает наш усовершенствованный сниппет.


    При вставке динамических элементов, которые ожидают от пользователя каких-либо действий (заполнение, выбор и т. д.), будет открываться отдельное окно, в котором над этими элементами нужно будет произвести соответствующие действия.

    Создание шаблонов заметок


    Еще один пример: создание шаблонов структуры рабочих заметок. Я веду заметки с поддержкой markdown для билдов мобильных приложений с определенной структурой и использую сниппеты для их быстрого генерирования.

    Ниже продемонстрирован пример вставки готового шаблона в заметки.


    Заполнение тестовых форм


    При работе с веб/десктоп-приложениями можно использовать сниппеты для заполнения форм данными.

    С помощью имитации нажатия кнопки Tab переход между полями происходит автоматически.


    Создание отчетов


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

    Используем динамические элементы, форматированный текст и картинки.

    В итоге получим готовую структуру отчета, которую можно быстро заполнить нужными значениями и отправить письмо.


    Инструменты для мобильных ОС


    Android


    В Android можно использовать Texpand или Gboard. К сожалению, в обоих приложениях нет возможности синхронизации между устройствами.

    Gboard поддерживает только обычный текст. По сути это расширенный буфер обмена, в котором можно закреплять некоторые из фрагментов.


    В Texpand возможности шире. В бесплатной версии есть поддержка 10 сниппетов, динамических даты и времени, вставки из буфера обмена и установки позиции курсора. Также можно создать бэкап и импортировать сниппеты на другие устройства.


    iOS


    В iOS есть встроенная автозамена, поддерживает только обычный текст.

    Также есть версии TextExpander и PhraseExpress для iOS.

    В TextExpander все сниппеты синхронизируются между десктопной и мобильной версией. В мобильной версии есть ряд ограничений по сравнению с десктопной версией:

    1. Сниппеты раскрываются при печати только при активной клавиатуре TextExpander (вместе с приложением идет клавиатура, которую можно включить в настройках iOS).
    2. Взаимодействие с динамическими элементами (заполнение, выбор и т. д.) работает только в самом приложении, в сегменте «Notes». Оттуда заполненный сниппет можно скопировать или переслать через меню шеринга.
    3. Не работают скриптовые сниппеты (в этой статье они не рассматривались).


    Можно добавить сниппеты в избранное для быстрого доступа из клавиатуры.

    Ниже продемонстрирован пример работы с динамическим сниппетом.


    Заключение


    Мы рассмотрели работу статических и динамических сниппетов на примере создания тестовой документации. Их также можно использовать для создания различного рода писем (повторяющихся почтовых рассылок, предложений о рассмотрении вакансий и т. д.), структуры документов и заметок, генерации кода и много чего еще.

    Спасибо за то, что дочитали статью до конца. Надеюсь, информация, изложенная в ней, окажется для вас полезной, и вы сможете сэкономить время, используя ее на практике. Если у вас возникли какие-либо вопросы по статье — буду рад на них ответить. В следующей статье я планирую написать об использовании скриптовых сниппетов. А пока предлагаю подписаться на мой Telegram-канал, где я публикую всю остальную информацию на тему тестирования.
    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама

    Комментарии 2

      0
      Начав читать, буквально сразу мне стало понятно, что «снипеты» я использовал всегда, не зная этого термина. Точнее — это я думал это обыкновенная автозамена, которая выполняется «налету». Которой стало удобно пользоваться когда появились клавиатурные менеджеры типа «punto switcher» и т.п.
      Оговорю сразу — кто был «первым» мне лично не важно, я впервые увидел и стал использовать именно «punto switcher», потому и веду «отсчет» от него.

      И ключевое — возможно я ошибаюсь, но «снипет» и «автозамена» — это разве одно и тоже?
      спрашивают потому, что попытка осилить текст не далась. возможно потому, что я читал в конце дня… возможно еще и потому что текст не дает нужной мне информации — кратко.
      и еще спрашиваю потому, что вообщето, определение «снипет» — «по гуглу» вроде как явно иное… чем дается тут в статье.
      сравните:
      статья — «Сниппеты — это фрагменты текста (кода), которые сохраняются для последующего многократного использования. Сниппеты бывают трех видов: статические (обычный текст), динамические (с использованием переменных) и скриптовые (с использованием кода).»
      и
      гугл1 wiki_en — «is defined as a small piece of something; it may in more specific contexts refer to: бла бла бла… и ключевое: (programming), a short reusable piece of computer source code»
      и
      гугл1 wiki_ru — «Сниппет (англ. snippet — отрывок, фрагмент) — фрагмент исходного текста или кода программы, применяемый в поисковых системах, текстовых редакторах и средах разработки.»
      и
      гугл1 wiki — «Сниппет — это блок информации в результатах поиска, который содержит краткие сведения о веб-странице. Сниппет сайта обязательно включает заголовок, ссылку на страницу и ее описание. Расскажем подробнее, как формируются ключевые элементы сниппета в поисковых системах.»
      и
      гугл2 — «Сниппет (от англ. snippet — «отрывок, фрагмент») — это информационный блок, который выводится рядом со ссылкой в поисковой выдаче. Сниппет состоит из заголовка и описания страницы, также может содержать дополнительную информацию. Сниппет дает первое представление пользователю: найдет ли он на этом сайте нужную информацию.»
      и
      гугл3 — «Сниппет (от англ. snippet — фрагмент) — это часть содержимого страницы сайта, которая по мнению поисковика? опысывает его содержимое и может быть выведено посетителю поисковой системы в качестве подсказки в результатах выдачи.»

      мда. дальше искать разницы уже стало совсем лениво.
      поэтому прошу пояснить — почему ваше определение «снипет» существенно отличается от определения которое дают «в гугле»? И прошу не искать в моих вопросах какойто злобности или иного. Спрашиваю чисто в рамках развития. Вдруг и правда — надо/правильно говорить «снипет» вместо «автозамена»
        0
        Да одно и то же, часто ведь переизобретается велосипед и дается ему уникальное название.
        Лет через 5 это назовется каким-нибудь «фасткодом» или «хоткодом» :)

      Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

      Самое читаемое