@testing-library/react#getAllByTitle TypeScript Examples

The following examples show how to use @testing-library/react#getAllByTitle. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: EnumerationMappingEditor.test.tsx From legend-studio with Apache License 2.0
4 votes
test.only(
  integrationTest('Enumeration mapping editor basic functionality'),
  async () => {
    await TEST__openElementFromExplorerTree('demo::MyMap', renderResult);
    const editPanelHeader = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.EDIT_PANEL__HEADER_TABS),
    );
    await waitFor(() => getByText(editPanelHeader, 'MyMap'));
    const mappingExplorer = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.MAPPING_EXPLORER),
    );
    await waitFor(() => getByText(mappingExplorer, 'Enum_1'));
    await waitFor(() => getByText(mappingExplorer, 'Enum_2'));
    // open Enum_1 [enumToEnum] enumeration mapping
    await waitFor(() => getByText(mappingExplorer, 'Enum_1 [enumToEnum]'));
    fireEvent.click(getByText(mappingExplorer, 'Enum_1 [enumToEnum]'));
    // Enum_1 [enumToEnum] mapping source values
    let sourcePanel = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.SOURCE_PANEL),
    );
    await waitFor(() => getByText(sourcePanel, 'Enum_2'));
    await waitFor(() => getByText(sourcePanel, 'zero'));
    await waitFor(() => getByText(sourcePanel, 'one'));
    let mainEditor = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.MAIN_EDITOR),
    );
    // Enum_1 [enumToEnum] mapping source value labels
    await waitFor(() => getByText(mainEditor, '_0'));
    await waitFor(() => getByText(mainEditor, '_1'));
    // Enum_1 [enumToEnum] mapping inputs
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="zero"]`)),
    ).not.toBeNull();
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="one"]`)),
    ).not.toBeNull();
    // Enum_1 [enumToEnum] mapping input return types
    let returnTypes = await waitFor(() => getAllByText(mainEditor, 'Enum_2'));
    expect(returnTypes).toHaveLength(4);
    // open enum_2 enumeration mapping
    fireEvent.click(getByText(mappingExplorer, 'Enum_2'));
    sourcePanel = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.SOURCE_PANEL),
    );
    await waitFor(() => getByText(sourcePanel, 'String'));
    mainEditor = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.MAIN_EDITOR),
    );
    // enum_2 mapping source value labels
    await waitFor(() => getByText(mainEditor, 'one'));
    await waitFor(() => getByText(mainEditor, 'zero'));
    // enum_2 mapping inputs
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="0"]`)),
    ).not.toBeNull();
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="1"]`)),
    ).not.toBeNull();
    // enum_2 mapping input return types
    returnTypes = await waitFor(() => getAllByText(mainEditor, 'String'));
    expect(returnTypes).toHaveLength(4);
    // open enum_1 enumeration mapping
    fireEvent.click(getByText(mappingExplorer, 'Enum_1'));
    sourcePanel = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.SOURCE_PANEL),
    );
    await waitFor(() => getByText(sourcePanel, 'String'));
    mainEditor = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.MAIN_EDITOR),
    );
    // enum_2 mapping source value labels
    await waitFor(() => getByText(mainEditor, '_0'));
    await waitFor(() => getByText(mainEditor, '_1'));
    // enum_2 mapping inputs
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="false"]`)),
    ).not.toBeNull();
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="0"]`)),
    ).not.toBeNull();
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="true"]`)),
    ).not.toBeNull();
    expect(
      await waitFor(() => mainEditor.querySelector(`input[value="1"]`)),
    ).not.toBeNull();
    // enum_2 mapping input return types
    returnTypes = await waitFor(() => getAllByText(mainEditor, 'String'));
    expect(returnTypes).toHaveLength(6);

    // test tabs
    const mappingEditorState =
      mockedEditorStore.getCurrentEditorState(MappingEditorState);
    expect(mappingEditorState.openedTabStates).toHaveLength(3);
    const mappingTabs = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.EDITOR__TABS__HEADER),
    );
    fireEvent.click(getByText(mappingTabs, 'Enum_1 [enumToEnum]'));
    mainEditor = await waitFor(() =>
      renderResult.getByTestId(LEGEND_STUDIO_TEST_ID.MAIN_EDITOR),
    );
    await waitFor(() => getAllByText(mainEditor, 'Enum_2'));
    // close
    fireEvent.click(getAllByTitle(mappingTabs, 'Close')[0] as HTMLElement);
    expect(mappingEditorState.openedTabStates).toHaveLength(2);
    fireEvent.click(getAllByTitle(mappingTabs, 'Close')[0] as HTMLElement);
    expect(mappingEditorState.openedTabStates).toHaveLength(1);
    fireEvent.click(getAllByTitle(mappingTabs, 'Close')[0] as HTMLElement);
    // assert no current tab state
    expect(mappingEditorState.openedTabStates).toHaveLength(0);
    expect(mappingEditorState.currentTabState).toBeUndefined();
  },
);