Skip to content

test: React 18 snapshot adjustments #6944

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
tkajtoch merged 7 commits into from
Jul 13, 2023
Merged

test: React 18 snapshot adjustments #6944

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
e17f663
test: unify style properties values between React 18 and earlier vers…
tkajtoch Jul 13, 2023
4448bb9
test: Separate Droppable snapshots by React version and add describeB…
tkajtoch Jul 13, 2023
f51a1a2
test: separate Draggable snapshots by React version
tkajtoch Jul 13, 2023
c907d8f
test: separate column selector snapshots by React version
tkajtoch Jul 13, 2023
b63c22f
test: separate column sorting snapshots by React version
tkajtoch Jul 13, 2023
9c8441d
fix: unify empty string rendering in snapshots between testing-librar…
tkajtoch Jul 13, 2023
908c14c
docs: add testByReactVersion jsdoc
tkajtoch Jul 13, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
299 changes: 297 additions & 2 deletions src/components/datagrid/controls/__snapshots__/column_selector.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`useDataGridColumnSelector columnSelector renders a toolbar button/popover allowing users to set column visibility and order 1`] = `
exports[`useDataGridColumnSelector columnSelector [React 17] renders a toolbar button/popover allowing users to set column visibility and order 1`] = `
<div
class="euiPopover emotion-euiPopover"
data-test-subj="dataGridColumnSelectorPopover"
Expand Down Expand Up @@ -31,7 +31,7 @@ exports[`useDataGridColumnSelector columnSelector renders a toolbar button/popov
</div>
`;

exports[`useDataGridColumnSelector columnSelector renders a toolbar button/popover allowing users to set column visibility and order 2`] = `
exports[`useDataGridColumnSelector columnSelector [React 17] renders a toolbar button/popover allowing users to set column visibility and order 2`] = `
<div
aria-describedby="generated-id"
aria-live="off"
Expand Down Expand Up @@ -294,3 +294,298 @@ exports[`useDataGridColumnSelector columnSelector renders a toolbar button/popov
</div>
</div>
`;

exports[`useDataGridColumnSelector columnSelector [React 18] renders a toolbar button/popover allowing users to set column visibility and order 1`] = `
<div
class="euiPopover emotion-euiPopover"
data-test-subj="dataGridColumnSelectorPopover"
>
<div
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiDataGrid__controlBtn emotion-euiButtonDisplay-euiButtonEmpty-xs-empty-text"
data-test-subj="dataGridColumnSelectorButton"
type="button"
>
<span
class="euiButtonEmpty__content emotion-euiButtonDisplayContent"
>
<span
color="inherit"
data-euiicon-type="listAdd"
/>
<span
class="eui-textTruncate euiButtonEmpty__text"
>
Columns
</span>
</span>
</button>
</div>
</div>
`;

exports[`useDataGridColumnSelector columnSelector [React 18] renders a toolbar button/popover allowing users to set column visibility and order 2`] = `
<div
aria-describedby="generated-id"
aria-live="off"
aria-modal="true"
class="euiPanel euiPanel--plain euiPanel--paddingSmall euiPopover__panel emotion-euiPanel-grow-m-s-plain-euiPopover__panel-hasDragDrop-bottom"
data-autofocus="true"
data-popover-panel="true"
role="dialog"
style="top: 16px; left: -22px; will-change: transform, opacity; z-index: 2000;"
tabindex="0"
>
<div
class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
data-popover-arrow="bottom"
style="left: 10px; top: 0px;"
/>
<p
class="emotion-euiScreenReaderOnly"
id="generated-id"
>
You are in a dialog. Press Escape, or tap/click outside the dialog to close.
</p>
<div>
<div>
<div
class="euiPopoverTitle emotion-euiPopoverTitle-s-s"
>
<div
class="euiFormControlLayout euiFormControlLayout--compressed"
>
<div
class="euiFormControlLayout__childrenWrapper"
>
<input
aria-label="Search columns"
class="euiFieldText euiFieldText--compressed"
data-test-subj="dataGridColumnSelectorSearch"
placeholder="Search"
type="text"
value=""
/>
</div>
</div>
</div>
<div
class="euiDataGrid__controlScroll"
>
<div
class="euiDroppable euiDroppable--noGrow"
data-rfd-droppable-context-id=":r0:"
data-rfd-droppable-id="columnOrder"
data-test-subj="droppable"
>
<div
class="euiDraggable euiDraggable--hasCustomDragHandle"
data-rfd-draggable-context-id=":r0:"
data-rfd-draggable-id="columnA"
data-test-subj="draggable"
role="group"
>
<div
class="euiDataGridColumnSelector__item false euiDraggable__item euiDraggable__item--hasCustomDragHandle"
data-test-subj="dataGridColumnSelectorColumnItem-columnA"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-s-flexStart-center-row"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<div
class="euiSwitch euiSwitch--compressed euiSwitch--mini emotion-euiSwitch"
>
<button
aria-checked="true"
aria-label="columnA"
class="euiSwitch__button"
data-test-subj="dataGridColumnSelectorToggleColumnVisibility-columnA"
id="generated-id"
name="columnA"
role="switch"
type="button"
>
<span
class="euiSwitch__body"
>
<span
class="euiSwitch__thumb"
/>
<span
class="euiSwitch__track"
/>
</span>
</button>
</div>
</div>
<div
aria-describedby="rfd-hidden-text-:r0:-hidden-text-:r1:"
aria-hidden="true"
class="euiFlexItem emotion-euiFlexItem-grow-1"
data-rfd-drag-handle-context-id=":r0:"
data-rfd-drag-handle-draggable-id="columnA"
draggable="false"
role="button"
tabindex="-1"
>
<span
class="euiDataGridColumnSelector__itemLabel"
>
columnA
</span>
</div>
<div
aria-describedby="rfd-hidden-text-:r0:-hidden-text-:r1:"
aria-label="Drag handle"
class="euiFlexItem emotion-euiFlexItem-growZero"
data-rfd-drag-handle-context-id=":r0:"
data-rfd-drag-handle-draggable-id="columnA"
draggable="false"
role="button"
tabindex="0"
>
<span
color="subdued"
data-euiicon-type="grab"
/>
</div>
</div>
</div>
</div>
<div
class="euiDraggable euiDraggable--hasCustomDragHandle"
data-rfd-draggable-context-id=":r0:"
data-rfd-draggable-id="columnB"
data-test-subj="draggable"
role="group"
>
<div
class="euiDataGridColumnSelector__item false euiDraggable__item euiDraggable__item--hasCustomDragHandle"
data-test-subj="dataGridColumnSelectorColumnItem-columnB"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-s-flexStart-center-row"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<div
class="euiSwitch euiSwitch--compressed euiSwitch--mini emotion-euiSwitch"
>
<button
aria-checked="true"
aria-label="columnB"
class="euiSwitch__button"
data-test-subj="dataGridColumnSelectorToggleColumnVisibility-columnB"
id="generated-id"
name="columnB"
role="switch"
type="button"
>
<span
class="euiSwitch__body"
>
<span
class="euiSwitch__thumb"
/>
<span
class="euiSwitch__track"
/>
</span>
</button>
</div>
</div>
<div
aria-describedby="rfd-hidden-text-:r0:-hidden-text-:r1:"
aria-hidden="true"
class="euiFlexItem emotion-euiFlexItem-grow-1"
data-rfd-drag-handle-context-id=":r0:"
data-rfd-drag-handle-draggable-id="columnB"
draggable="false"
role="button"
tabindex="-1"
>
<span
class="euiDataGridColumnSelector__itemLabel"
>
columnB
</span>
</div>
<div
aria-describedby="rfd-hidden-text-:r0:-hidden-text-:r1:"
aria-label="Drag handle"
class="euiFlexItem emotion-euiFlexItem-growZero"
data-rfd-drag-handle-context-id=":r0:"
data-rfd-drag-handle-draggable-id="columnB"
draggable="false"
role="button"
tabindex="0"
>
<span
color="subdued"
data-euiicon-type="grab"
/>
</div>
</div>
</div>
</div>
<div
class="euiDroppable__placeholder"
/>
</div>
</div>
</div>
<div
class="euiPopoverFooter emotion-euiPopoverFooter-s-s"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-s-spaceBetween-stretch-row"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<button
class="euiButtonEmpty emotion-euiButtonDisplay-euiButtonEmpty-xs-empty-primary-flush-left"
data-test-subj="dataGridColumnSelectorShowAllButton"
type="button"
>
<span
class="euiButtonEmpty__content emotion-euiButtonDisplayContent"
>
<span
class="eui-textTruncate euiButtonEmpty__text"
>
Show all
</span>
</span>
</button>
</div>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<button
class="euiButtonEmpty emotion-euiButtonDisplay-euiButtonEmpty-xs-empty-primary-flush-right"
data-test-subj="dataGridColumnSelectorHideAllButton"
type="button"
>
<span
class="euiButtonEmpty__content emotion-euiButtonDisplayContent"
>
<span
class="eui-textTruncate euiButtonEmpty__text"
>
Hide all
</span>
</span>
</button>
</div>
</div>
</div>
</div>
</div>
`;
16 changes: 8 additions & 8 deletions src/components/datagrid/controls/__snapshots__/column_sorting.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`useDataGridColumnSorting columnSorting renders a toolbar button/popover allowing users to set column sorting 1`] = `
exports[`useDataGridColumnSorting columnSorting [React 18] renders a toolbar button/popover allowing users to set column sorting 1`] = `
<div
class="euiPopover emotion-euiPopover"
data-test-subj="dataGridColumnSortingPopover"
Expand Down Expand Up @@ -31,7 +31,7 @@ exports[`useDataGridColumnSorting columnSorting renders a toolbar button/popover
</div>
`;

exports[`useDataGridColumnSorting columnSorting renders a toolbar button/popover allowing users to set column sorting 2`] = `
exports[`useDataGridColumnSorting columnSorting [React 18] renders a toolbar button/popover allowing users to set column sorting 2`] = `
<div
aria-describedby="generated-id"
aria-live="off"
Expand Down Expand Up @@ -62,13 +62,13 @@ exports[`useDataGridColumnSorting columnSorting renders a toolbar button/popover
>
<div
class="euiDroppable euiDroppable--noGrow"
data-rfd-droppable-context-id="0"
data-rfd-droppable-context-id=":r0:"
data-rfd-droppable-id="columnSorting"
data-test-subj="droppable"
>
<div
class="euiDraggable euiDraggable--hasCustomDragHandle"
data-rfd-draggable-context-id="0"
data-rfd-draggable-context-id=":r0:"
data-rfd-draggable-id="columnA"
data-test-subj="draggable"
role="group"
Expand Down Expand Up @@ -102,10 +102,10 @@ exports[`useDataGridColumnSorting columnSorting renders a toolbar button/popover
</button>
</div>
<div
aria-describedby="rfd-hidden-text-0-hidden-text-0"
aria-describedby="rfd-hidden-text-:r0:-hidden-text-:r1:"
aria-hidden="true"
class="euiFlexItem euiDataGridColumnSorting__name emotion-euiFlexItem-grow-1"
data-rfd-drag-handle-context-id="0"
data-rfd-drag-handle-context-id=":r0:"
data-rfd-drag-handle-draggable-id="columnA"
draggable="false"
role="button"
Expand Down Expand Up @@ -205,10 +205,10 @@ exports[`useDataGridColumnSorting columnSorting renders a toolbar button/popover
</fieldset>
</div>
<div
aria-describedby="rfd-hidden-text-0-hidden-text-0"
aria-describedby="rfd-hidden-text-:r0:-hidden-text-:r1:"
aria-label="Drag handle"
class="euiFlexItem emotion-euiFlexItem-growZero"
data-rfd-drag-handle-context-id="0"
data-rfd-drag-handle-context-id=":r0:"
data-rfd-drag-handle-draggable-id="columnA"
draggable="false"
role="button"
Expand Down
Loading