Skip to content

Commit

Permalink
test: fix validateDOMNesting warning (#7508)
Browse files Browse the repository at this point in the history 
Signed-off-by: Eng Zer Jun <[email protected]>
Co-authored-by: Cee Chen <[email protected]>
  • Loading branch information
@Juneezee @cee-chen
Juneezee and cee-chen authored Feb 5, 2024
1 parent dc604af commit 70634a0
Show file tree
Hide file tree
Showing 17 changed files with 1,050 additions and 718 deletions.
13 changes: 0 additions & 13 deletions scripts/jest/setup/throw_on_console_error.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,18 +37,5 @@ console.error = (message, ...rest) => {
return;
}

// Print React validateDOMNesting warning as a console.warn instead
// of throwing an error.
// TODO: Remove when edge-case DOM nesting is fixed in all components
if (
typeof message === 'string' &&
message.startsWith(
'Warning: validateDOMNesting(...): %s cannot appear as a child of <%s>'
)
) {
console.warn(message, ...rest);
return;
}

throw new Error(format(message, ...rest));
};
8 changes: 5 additions & 3 deletions src/components/table/__snapshots__/table_footer.test.tsx.snap
View file
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`EuiTableFooter is rendered 1`] = `
<div>
<table>
<tfoot
aria-label="aria-label"
class="testClass1 testClass2 emotion-euiTestCss"
data-test-subj="test subject string"
>
<tr>
children
<td>
children
</td>
</tr>
</tfoot>
</div>
</table>
`;
256 changes: 152 additions & 104 deletions src/components/table/__snapshots__/table_footer_cell.test.tsx.snap
View file
Original file line number Diff line number Diff line change
@@ -1,129 +1,177 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`EuiTableFooterCell align defaults to left 1`] = `
<td
class="euiTableFooterCell"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
/>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
/>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell align renders center when specified 1`] = `
<td
class="euiTableFooterCell"
>
<div
class="euiTableCellContent euiTableCellContent--alignCenter"
>
<span
class="euiTableCellContent__text"
/>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
>
<div
class="euiTableCellContent euiTableCellContent--alignCenter"
>
<span
class="euiTableCellContent__text"
/>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell align renders right when specified 1`] = `
<td
class="euiTableFooterCell"
>
<div
class="euiTableCellContent euiTableCellContent--alignRight"
>
<span
class="euiTableCellContent__text"
/>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
>
<div
class="euiTableCellContent euiTableCellContent--alignRight"
>
<span
class="euiTableCellContent__text"
/>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell is rendered 1`] = `
<td
aria-label="aria-label"
class="euiTableFooterCell testClass1 testClass2 emotion-euiTestCss"
data-test-subj="test subject string"
>
<div
class="euiTableCellContent testClass1 testClass2 emotion-euiTestCss"
>
<span
class="euiTableCellContent__text"
>
children
</span>
</div>
</td>
<table>
<tfoot>
<tr>
<td
aria-label="aria-label"
class="euiTableFooterCell testClass1 testClass2 emotion-euiTestCss"
data-test-subj="test subject string"
>
<div
class="euiTableCellContent testClass1 testClass2 emotion-euiTestCss"
>
<span
class="euiTableCellContent__text"
>
children
</span>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell width and style accepts style attribute 1`] = `
<td
class="euiTableFooterCell"
style="width: 20%;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
style="width: 20%;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell width and style accepts width attribute 1`] = `
<td
class="euiTableFooterCell"
style="width: 10%;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
style="width: 10%;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell width and style accepts width attribute as number 1`] = `
<td
class="euiTableFooterCell"
style="width: 100px;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
style="width: 100px;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
</tr>
</tfoot>
</table>
`;

exports[`EuiTableFooterCell width and style resolves style and width attribute 1`] = `
<td
class="euiTableFooterCell"
style="width: 10%;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
<table>
<tfoot>
<tr>
<td
class="euiTableFooterCell"
style="width: 10%;"
>
<div
class="euiTableCellContent"
>
<span
class="euiTableCellContent__text"
>
Test
</span>
</div>
</td>
</tr>
</tfoot>
</table>
`;
40 changes: 22 additions & 18 deletions src/components/table/__snapshots__/table_header.test.tsx.snap
View file
Original file line number Diff line number Diff line change
@@ -1,25 +1,29 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`EuiTableHeader is rendered 1`] = `
<thead
aria-label="aria-label"
class="testClass1 testClass2 emotion-euiTestCss"
data-test-subj="test subject string"
>
<tr>
<td>
children
</td>
</tr>
</thead>
<table>
<thead
aria-label="aria-label"
class="testClass1 testClass2 emotion-euiTestCss"
data-test-subj="test subject string"
>
<tr>
<td>
children
</td>
</tr>
</thead>
</table>
`;

exports[`EuiTableHeader is rendered without <tr> 1`] = `
<thead>
<tr>
<td>
children
</td>
</tr>
</thead>
<table>
<thead>
<tr>
<td>
children
</td>
</tr>
</thead>
</table>
`;
Loading

0 comments on commit 70634a0

Please sign in to comment.