Update test renderer in few components, (https://github.com/woocommerce/woocommerce-admin/pull/7425)
from `react-test-renderer` to `{ render } from '@testing-library/react'`,
to avoid confision like https://github.com/woocommerce/woocommerce-admin/pull/7378#issuecomment-885870676.
Update snapshots respectively.
This commit is contained in:
Tomek Wytrębowicz
GitHub
parent
52e69697f8
commit
4e153faa35
|
|
@ -1,11 +1,78 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`AnimationSlider it renders correctly 1`] = `
|
||||
<div
|
||||
className="woocommerce-slide-animation animate-left"
|
||||
>
|
||||
<div>
|
||||
<div />
|
||||
</div>
|
||||
</div>
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<div>
|
||||
<div
|
||||
class="woocommerce-slide-animation animate-left"
|
||||
>
|
||||
<div>
|
||||
<div />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<div
|
||||
class="woocommerce-slide-animation animate-left"
|
||||
>
|
||||
<div>
|
||||
<div />
|
||||
</div>
|
||||
</div>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import renderer from 'react-test-renderer';
|
||||
import { render } from '@testing-library/react';
|
||||
import { createElement } from '@wordpress/element';
|
||||
|
||||
/**
|
||||
|
|
@ -11,13 +11,11 @@ import AnimationSlider from '../';
|
|||
|
||||
describe( 'AnimationSlider', () => {
|
||||
test( 'it renders correctly', () => {
|
||||
const tree = renderer
|
||||
.create(
|
||||
<AnimationSlider animationKey={ 0 } animate={ 'left' }>
|
||||
{ () => <div /> }
|
||||
</AnimationSlider>
|
||||
)
|
||||
.toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render(
|
||||
<AnimationSlider animationKey={ 0 } animate={ 'left' }>
|
||||
{ () => <div /> }
|
||||
</AnimationSlider>
|
||||
);
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
} );
|
||||
|
|
|
|||
|
|
@ -1,16 +1,112 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`DropdownButton it renders correctly 1`] = `
|
||||
<button
|
||||
className="components-button woocommerce-dropdown-button"
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
className="woocommerce-dropdown-button__labels"
|
||||
>
|
||||
<span>
|
||||
foo
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<p
|
||||
class="a11y-speak-intro-text"
|
||||
hidden="hidden"
|
||||
id="a11y-speak-intro-text"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
>
|
||||
Notifications
|
||||
</p>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="assertive"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-assertive"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-polite"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div>
|
||||
<button
|
||||
class="components-button woocommerce-dropdown-button"
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="woocommerce-dropdown-button__labels"
|
||||
>
|
||||
<span>
|
||||
foo
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<button
|
||||
class="components-button woocommerce-dropdown-button"
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="woocommerce-dropdown-button__labels"
|
||||
>
|
||||
<span>
|
||||
foo
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import renderer from 'react-test-renderer';
|
||||
import { render } from '@testing-library/react';
|
||||
import { createElement } from '@wordpress/element';
|
||||
|
||||
/**
|
||||
|
|
@ -11,9 +11,7 @@ import DropdownButton from '../';
|
|||
|
||||
describe( 'DropdownButton', () => {
|
||||
test( 'it renders correctly', () => {
|
||||
const tree = renderer
|
||||
.create( <DropdownButton labels={ [ 'foo' ] } /> )
|
||||
.toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render( <DropdownButton labels={ [ 'foo' ] } /> );
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
} );
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,7 +1,7 @@
|
|||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import renderer from 'react-test-renderer';
|
||||
import { render } from '@testing-library/react';
|
||||
import { noop } from 'lodash';
|
||||
import { createElement } from '@wordpress/element';
|
||||
|
||||
|
|
@ -30,7 +30,7 @@ const hierarchicalList = [
|
|||
|
||||
describe( 'SearchListControl', () => {
|
||||
test( 'should render a search box and list of options', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -38,11 +38,11 @@ describe( 'SearchListControl', () => {
|
|||
onChange={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box and list of options with a custom className', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
className="test-search"
|
||||
|
|
@ -51,11 +51,11 @@ describe( 'SearchListControl', () => {
|
|||
onChange={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box, a list of options, and 1 selected item', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -63,11 +63,11 @@ describe( 'SearchListControl', () => {
|
|||
onChange={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box, a list of options, and 2 selected item', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -75,11 +75,11 @@ describe( 'SearchListControl', () => {
|
|||
onChange={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box and no options', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ [] }
|
||||
|
|
@ -87,11 +87,11 @@ describe( 'SearchListControl', () => {
|
|||
onChange={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box with a search term, and only matching options', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -101,11 +101,11 @@ describe( 'SearchListControl', () => {
|
|||
debouncedSpeak={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box with a search term, and only matching options, regardless of case sensitivity', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -115,11 +115,11 @@ describe( 'SearchListControl', () => {
|
|||
debouncedSpeak={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box with a search term, and no matching options', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -129,12 +129,12 @@ describe( 'SearchListControl', () => {
|
|||
debouncedSpeak={ noop }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box and list of options, with a custom search input message', () => {
|
||||
const messages = { search: 'Testing search label' };
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -143,14 +143,14 @@ describe( 'SearchListControl', () => {
|
|||
messages={ messages }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box and list of options, with a custom render callback for each item', () => {
|
||||
const renderItem = ( { item } ) => (
|
||||
<div key={ item.id }>{ item.name }!</div>
|
||||
); // eslint-disable-line
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ list }
|
||||
|
|
@ -159,11 +159,11 @@ describe( 'SearchListControl', () => {
|
|||
renderItem={ renderItem }
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( 'should render a search box and list of hierarchical options', () => {
|
||||
const component = renderer.create(
|
||||
const component = render(
|
||||
<SearchListControl
|
||||
instanceId={ 1 }
|
||||
list={ hierarchicalList }
|
||||
|
|
@ -172,6 +172,6 @@ describe( 'SearchListControl', () => {
|
|||
isHierarchical
|
||||
/>
|
||||
);
|
||||
expect( component.toJSON() ).toMatchSnapshot();
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
} );
|
||||
|
|
|
|||
|
|
@ -1,16 +1,112 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`SectionHeader it renders correctly 1`] = `
|
||||
<div
|
||||
className="woocommerce-section-header"
|
||||
>
|
||||
<h2
|
||||
className="woocommerce-section-header__title woocommerce-section-header__header-item"
|
||||
>
|
||||
A SectionHeader Example
|
||||
</h2>
|
||||
<hr
|
||||
role="presentation"
|
||||
/>
|
||||
</div>
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<p
|
||||
class="a11y-speak-intro-text"
|
||||
hidden="hidden"
|
||||
id="a11y-speak-intro-text"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
>
|
||||
Notifications
|
||||
</p>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="assertive"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-assertive"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-polite"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div>
|
||||
<div
|
||||
class="woocommerce-section-header"
|
||||
>
|
||||
<h2
|
||||
class="woocommerce-section-header__title woocommerce-section-header__header-item"
|
||||
>
|
||||
A SectionHeader Example
|
||||
</h2>
|
||||
<hr
|
||||
role="presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<div
|
||||
class="woocommerce-section-header"
|
||||
>
|
||||
<h2
|
||||
class="woocommerce-section-header__title woocommerce-section-header__header-item"
|
||||
>
|
||||
A SectionHeader Example
|
||||
</h2>
|
||||
<hr
|
||||
role="presentation"
|
||||
/>
|
||||
</div>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import renderer from 'react-test-renderer';
|
||||
import { render } from '@testing-library/react';
|
||||
import { createElement } from '@wordpress/element';
|
||||
|
||||
/**
|
||||
|
|
@ -16,9 +16,9 @@ describe( 'SectionHeader', () => {
|
|||
} );
|
||||
|
||||
test( 'it renders correctly', () => {
|
||||
const tree = renderer
|
||||
.create( <SectionHeader title="A SectionHeader Example" /> )
|
||||
.toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render(
|
||||
<SectionHeader title="A SectionHeader Example" />
|
||||
);
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
} );
|
||||
|
|
|
|||
|
|
@ -1,112 +1,545 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Tag <Tag label="foo" /> should render a tag with the label foo 1`] = `
|
||||
<span
|
||||
className="woocommerce-tag"
|
||||
>
|
||||
<span
|
||||
className="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-0"
|
||||
>
|
||||
<span
|
||||
className="screen-reader-text"
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<p
|
||||
class="a11y-speak-intro-text"
|
||||
hidden="hidden"
|
||||
id="a11y-speak-intro-text"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
Notifications
|
||||
</p>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="assertive"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-assertive"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-polite"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div>
|
||||
<span
|
||||
class="woocommerce-tag"
|
||||
>
|
||||
<span
|
||||
class="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-0"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="woocommerce-tag"
|
||||
>
|
||||
foo
|
||||
<span
|
||||
class="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-0"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
||||
exports[`Tag <Tag label="foo" popoverContents={ <p>This is a popover</p> } /> should render a tag with a popover 1`] = `
|
||||
<span
|
||||
className="woocommerce-tag"
|
||||
>
|
||||
<button
|
||||
className="components-button woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-2"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
className="screen-reader-text"
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<p
|
||||
class="a11y-speak-intro-text"
|
||||
hidden="hidden"
|
||||
id="a11y-speak-intro-text"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
Notifications
|
||||
</p>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="assertive"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-assertive"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-polite"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div>
|
||||
<span
|
||||
class="woocommerce-tag"
|
||||
>
|
||||
<button
|
||||
class="components-button woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-2"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="woocommerce-tag"
|
||||
>
|
||||
foo
|
||||
<button
|
||||
class="components-button woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-2"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</button>
|
||||
</span>
|
||||
</button>
|
||||
</span>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
||||
exports[`Tag <Tag label="foo" remove={ noop } /> should render a tag with a close button 1`] = `
|
||||
<span
|
||||
className="woocommerce-tag has-remove"
|
||||
>
|
||||
<span
|
||||
className="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-1"
|
||||
>
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<p
|
||||
class="a11y-speak-intro-text"
|
||||
hidden="hidden"
|
||||
id="a11y-speak-intro-text"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
>
|
||||
Notifications
|
||||
</p>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="assertive"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-assertive"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-polite"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div>
|
||||
<span
|
||||
class="woocommerce-tag has-remove"
|
||||
>
|
||||
<span
|
||||
class="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-1"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
<button
|
||||
aria-describedby="woocommerce-tag__label-1"
|
||||
aria-label="Remove foo"
|
||||
class="components-button woocommerce-tag__remove"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class="clear-icon"
|
||||
focusable="false"
|
||||
height="20"
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
width="20"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21ZM15.5303 8.46967C15.8232 8.76256 15.8232 9.23744 15.5303 9.53033L13.0607 12L15.5303 14.4697C15.8232 14.7626 15.8232 15.2374 15.5303 15.5303C15.2374 15.8232 14.7626 15.8232 14.4697 15.5303L12 13.0607L9.53033 15.5303C9.23744 15.8232 8.76256 15.8232 8.46967 15.5303C8.17678 15.2374 8.17678 14.7626 8.46967 14.4697L10.9393 12L8.46967 9.53033C8.17678 9.23744 8.17678 8.76256 8.46967 8.46967C8.76256 8.17678 9.23744 8.17678 9.53033 8.46967L12 10.9393L14.4697 8.46967C14.7626 8.17678 15.2374 8.17678 15.5303 8.46967Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<span
|
||||
className="screen-reader-text"
|
||||
class="woocommerce-tag has-remove"
|
||||
>
|
||||
foo
|
||||
<span
|
||||
class="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-1"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
<button
|
||||
aria-describedby="woocommerce-tag__label-1"
|
||||
aria-label="Remove foo"
|
||||
class="components-button woocommerce-tag__remove"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class="clear-icon"
|
||||
focusable="false"
|
||||
height="20"
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
width="20"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21ZM15.5303 8.46967C15.8232 8.76256 15.8232 9.23744 15.5303 9.53033L13.0607 12L15.5303 14.4697C15.8232 14.7626 15.8232 15.2374 15.5303 15.5303C15.2374 15.8232 14.7626 15.8232 14.4697 15.5303L12 13.0607L9.53033 15.5303C9.23744 15.8232 8.76256 15.8232 8.46967 15.5303C8.17678 15.2374 8.17678 14.7626 8.46967 14.4697L10.9393 12L8.46967 9.53033C8.17678 9.23744 8.17678 8.76256 8.46967 8.46967C8.76256 8.17678 9.23744 8.17678 9.53033 8.46967L12 10.9393L14.4697 8.46967C14.7626 8.17678 15.2374 8.17678 15.5303 8.46967Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
<button
|
||||
aria-describedby="woocommerce-tag__label-1"
|
||||
aria-label="Remove foo"
|
||||
className="components-button woocommerce-tag__remove"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
aria-hidden={true}
|
||||
className="clear-icon"
|
||||
focusable={false}
|
||||
height={20}
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
width={20}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21ZM15.5303 8.46967C15.8232 8.76256 15.8232 9.23744 15.5303 9.53033L13.0607 12L15.5303 14.4697C15.8232 14.7626 15.8232 15.2374 15.5303 15.5303C15.2374 15.8232 14.7626 15.8232 14.4697 15.5303L12 13.0607L9.53033 15.5303C9.23744 15.8232 8.76256 15.8232 8.46967 15.5303C8.17678 15.2374 8.17678 14.7626 8.46967 14.4697L10.9393 12L8.46967 9.53033C8.17678 9.23744 8.17678 8.76256 8.46967 8.46967C8.76256 8.17678 9.23744 8.17678 9.53033 8.46967L12 10.9393L14.4697 8.46967C14.7626 8.17678 15.2374 8.17678 15.5303 8.46967Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
||||
exports[`Tag <Tag label="foo" screenReaderLabel="FooBar" /> should render a tag with a screen reader label 1`] = `
|
||||
<span
|
||||
className="woocommerce-tag"
|
||||
>
|
||||
<span
|
||||
className="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-3"
|
||||
>
|
||||
<span
|
||||
className="screen-reader-text"
|
||||
Object {
|
||||
"asFragment": [Function],
|
||||
"baseElement": <body>
|
||||
<p
|
||||
class="a11y-speak-intro-text"
|
||||
hidden="hidden"
|
||||
id="a11y-speak-intro-text"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
>
|
||||
FooBar
|
||||
</span>
|
||||
Notifications
|
||||
</p>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="assertive"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-assertive"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div
|
||||
aria-atomic="true"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="a11y-speak-region"
|
||||
id="a11y-speak-polite"
|
||||
style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;"
|
||||
/>
|
||||
<div>
|
||||
<span
|
||||
class="woocommerce-tag"
|
||||
>
|
||||
<span
|
||||
class="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-3"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
FooBar
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</body>,
|
||||
"container": <div>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="woocommerce-tag"
|
||||
>
|
||||
foo
|
||||
<span
|
||||
class="woocommerce-tag__text"
|
||||
id="woocommerce-tag__label-3"
|
||||
>
|
||||
<span
|
||||
class="screen-reader-text"
|
||||
>
|
||||
FooBar
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
>
|
||||
foo
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>,
|
||||
"debug": [Function],
|
||||
"findAllByAltText": [Function],
|
||||
"findAllByDisplayValue": [Function],
|
||||
"findAllByLabelText": [Function],
|
||||
"findAllByPlaceholderText": [Function],
|
||||
"findAllByRole": [Function],
|
||||
"findAllByTestId": [Function],
|
||||
"findAllByText": [Function],
|
||||
"findAllByTitle": [Function],
|
||||
"findByAltText": [Function],
|
||||
"findByDisplayValue": [Function],
|
||||
"findByLabelText": [Function],
|
||||
"findByPlaceholderText": [Function],
|
||||
"findByRole": [Function],
|
||||
"findByTestId": [Function],
|
||||
"findByText": [Function],
|
||||
"findByTitle": [Function],
|
||||
"getAllByAltText": [Function],
|
||||
"getAllByDisplayValue": [Function],
|
||||
"getAllByLabelText": [Function],
|
||||
"getAllByPlaceholderText": [Function],
|
||||
"getAllByRole": [Function],
|
||||
"getAllByTestId": [Function],
|
||||
"getAllByText": [Function],
|
||||
"getAllByTitle": [Function],
|
||||
"getByAltText": [Function],
|
||||
"getByDisplayValue": [Function],
|
||||
"getByLabelText": [Function],
|
||||
"getByPlaceholderText": [Function],
|
||||
"getByRole": [Function],
|
||||
"getByTestId": [Function],
|
||||
"getByText": [Function],
|
||||
"getByTitle": [Function],
|
||||
"queryAllByAltText": [Function],
|
||||
"queryAllByDisplayValue": [Function],
|
||||
"queryAllByLabelText": [Function],
|
||||
"queryAllByPlaceholderText": [Function],
|
||||
"queryAllByRole": [Function],
|
||||
"queryAllByTestId": [Function],
|
||||
"queryAllByText": [Function],
|
||||
"queryAllByTitle": [Function],
|
||||
"queryByAltText": [Function],
|
||||
"queryByDisplayValue": [Function],
|
||||
"queryByLabelText": [Function],
|
||||
"queryByPlaceholderText": [Function],
|
||||
"queryByRole": [Function],
|
||||
"queryByTestId": [Function],
|
||||
"queryByText": [Function],
|
||||
"queryByTitle": [Function],
|
||||
"rerender": [Function],
|
||||
"unmount": [Function],
|
||||
}
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import renderer from 'react-test-renderer';
|
||||
import { render } from '@testing-library/react';
|
||||
import { createElement } from '@wordpress/element';
|
||||
|
||||
/**
|
||||
|
|
@ -13,30 +13,26 @@ const noop = () => {};
|
|||
|
||||
describe( 'Tag', () => {
|
||||
test( '<Tag label="foo" /> should render a tag with the label foo', () => {
|
||||
const tree = renderer.create( <Tag label="foo" /> ).toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render( <Tag label="foo" /> );
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( '<Tag label="foo" remove={ noop } /> should render a tag with a close button', () => {
|
||||
const tree = renderer
|
||||
.create( <Tag label="foo" remove={ noop } /> )
|
||||
.toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render( <Tag label="foo" remove={ noop } /> );
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( '<Tag label="foo" popoverContents={ <p>This is a popover</p> } /> should render a tag with a popover', () => {
|
||||
const tree = renderer
|
||||
.create(
|
||||
<Tag label="foo" popoverContents={ <p>This is a popover</p> } />
|
||||
)
|
||||
.toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render(
|
||||
<Tag label="foo" popoverContents={ <p>This is a popover</p> } />
|
||||
);
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
|
||||
test( '<Tag label="foo" screenReaderLabel="FooBar" /> should render a tag with a screen reader label', () => {
|
||||
const tree = renderer
|
||||
.create( <Tag label="foo" screenReaderLabel="FooBar" /> )
|
||||
.toJSON();
|
||||
expect( tree ).toMatchSnapshot();
|
||||
const component = render(
|
||||
<Tag label="foo" screenReaderLabel="FooBar" />
|
||||
);
|
||||
expect( component ).toMatchSnapshot();
|
||||
} );
|
||||
} );
|
||||
|
|
|
|||
Loading…
Reference in New Issue