Перейти к основному содержимому

Тестирование экранной формы на автогенерируемых данных

На этапе разработки экранной формы вам может понадобиться протестировать визуальное представление экранной формы с данными в разработанном приложении. Для этой цели в DevTools вы можете воспользоваться автоматически генерируемыми данными. Генерация данных реализуется только для действий типа DataSet и GraphQL. Данные генерируются на основе контрактов данных.

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

  • количество генерируемых записей данных;
  • задержка по времени (в миллисекундах) генерации данных для тестирования асинхронности.

Чтобы настроить автоматическую генерацию данных, выполните следующие действия:

  1. В проекте выберите файл с расширением mdcontainer, соответствующий экранной форме, которую вы хотите протестировать с данными.

    В Редакторе Форм режим автогенерации данных выбран по умолчанию, о чем свидетельствует переключатель Mock в верхней части рабочей области.

  2. На боковой панели нажмите значок UG_settings_icon.png и в разделе Действия выберите действие, результатом выполнения которого является отображение данных.

  3. Откройте окно Действие с параметрами действия, результат которого вы хотите протестировать.

  4. В блоке Мокирование укажите следующие параметры:

    • Количество записей: укажите количество записей, которые вы хотите отобразить на экранной форме;
    • Задержка: укажите время задержки (в миллисекундах) для асинхронного выполнения действия.

  5. В окне Действие нажмите Сохранить.

  6. В Редакторе Форм перейдите в режим редактирования кода экранной формы и введите фрагмент кода, включающий вызов метода получения данных. Следующий пример демонстрирует фрагмент кода экранной формы:

<Container

Name="Index"
ContainerType="Page"
Commands={[]} 
Scripts={[
  async () => {
    const result = await sendDataSet("getAuthors");
    setState({
      data: result,
    });
  },
]}
Meta={{ templateType: "Default" }}
>
<Group CSS={["pt-16", "pb-16"]} Height="100%">
  <Repeater Mode="ol" Value-var="data">
    <RepeaterItem Alias="item" CurrentIndex="1">
      <Text Value-var="item.name" Mode="Strong"></Text>
      <Text CSS={["ml-4"]} Value-var="item. surname"></Text>
    </RepeaterItem>
  </Repeater>
</Group>
 </Container>;

  1. В Редакторе Форм перейдите в визуальный режим.

    Сгенерированные данные отображаются на экранной форме.

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

Если вид экранной формы с данными вас не устраивает, вы можете изменить свойства компонентов экранной формы и повторить действия, описанные в этой инструкции.