Skip to content

Commit

Permalink
Update tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@emeaguiar
emeaguiar committed Aug 11, 2022
1 parent 2f3a223 commit ff6da1f
Show file tree
Hide file tree
Showing 2 changed files with 41 additions and 26 deletions.
36 changes: 18 additions & 18 deletions plugin/tests/js/block-editor/blocks/button/__snapshots__/save.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ Object {
<div>
<div>
<a
class="mdc-button mdc-button--raised"
class="mdc-button mdc-button--undefined"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<div
class="mdc-button__ripple"
Expand All @@ -24,9 +24,9 @@ Object {
"container": <div>
<div>
<a
class="mdc-button mdc-button--raised"
class="mdc-button mdc-button--undefined"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<div
class="mdc-button__ripple"
Expand Down Expand Up @@ -98,9 +98,9 @@ Object {
<div>
<div>
<a
class="mdc-button mdc-button--raised"
class="mdc-button mdc-button--undefined"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<i
class="material-icons mdc-button__icon"
Expand All @@ -120,9 +120,9 @@ Object {
"container": <div>
<div>
<a
class="mdc-button mdc-button--raised"
class="mdc-button mdc-button--undefined"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<i
class="material-icons mdc-button__icon"
Expand Down Expand Up @@ -199,9 +199,9 @@ Object {
<div>
<div>
<a
class="mdc-button mdc-button--raised"
class="mdc-button mdc-button--undefined"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<div
class="mdc-button__ripple"
Expand All @@ -221,9 +221,9 @@ Object {
"container": <div>
<div>
<a
class="mdc-button mdc-button--raised"
class="mdc-button mdc-button--undefined"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<div
class="mdc-button__ripple"
Expand Down Expand Up @@ -464,9 +464,9 @@ Object {
<div>
<div>
<a
class="mdc-button mdc-button--raised is-large"
class="mdc-button mdc-button--undefined is-large"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<i
class="material-icons mdc-button__icon"
Expand All @@ -486,9 +486,9 @@ Object {
"container": <div>
<div>
<a
class="mdc-button mdc-button--raised is-large"
class="mdc-button mdc-button--undefined is-large"
href="https://google.com"
style="background-color: rgb(51, 51, 51); color: rgb(241, 241, 241); border-radius: 5px;"
style="color: rgb(241, 241, 241); border-radius: 5px;"
>
<i
class="material-icons mdc-button__icon"
Expand Down Expand Up @@ -565,7 +565,7 @@ Object {
<div>
<div>
<button
class="mdc-button label-large mdc-button--raised"
class="mdc-button label-large mdc-button--undefined"
>
<div
class="mdc-button__ripple"
Expand All @@ -580,7 +580,7 @@ Object {
"container": <div>
<div>
<button
class="mdc-button label-large mdc-button--raised"
class="mdc-button label-large mdc-button--undefined"
>
<div
class="mdc-button__ripple"
Expand Down
31 changes: 23 additions & 8 deletions plugin/tests/js/block-editor/blocks/button/edit.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ jest.mock( '@wordpress/data', () => ( {
} ) );

const baseProps = {
attributes: { type: 'text', style: 'text' },
attributes: { type: 'text', elevationStyle: 'text' },
setAttributes: jest.fn(),
};

Expand Down Expand Up @@ -122,7 +122,7 @@ describe( 'ButtonEdit', () => {

it( 'should display an text with outlined style', () => {
setup( {
attributes: { type: 'text', style: 'outlined' },
attributes: { type: 'text', elevationStyle: 'outlined' },
setAttributes: jest.fn(),
} );

Expand All @@ -135,36 +135,51 @@ describe( 'ButtonEdit', () => {
expect( screen.queryByText( 'Container Color' ) ).toBeNull();
} );

it( 'should display an text with raised style', () => {
it( 'should display an text with elevated style', () => {
setup( {
attributes: { type: 'text', style: 'raised' },
attributes: { type: 'text', elevationStyle: 'elevated' },
setAttributes: jest.fn(),
} );

const container = document.body;
const matches = container.querySelector(
'.mdc-button.mdc-button--raised'
'.mdc-button.mdc-button--elevated'
);

expect( matches ).toBeInTheDocument();
expect( screen.getByText( 'Container Color' ) ).toBeInTheDocument();
} );

it( 'should display an text with unelevated style', () => {
it( 'should display an text with filled style', () => {
setup( {
attributes: { type: 'text', style: 'unelevated' },
attributes: { type: 'text', elevationStyle: 'filled' },
setAttributes: jest.fn(),
} );

const container = document.body;
const matches = container.querySelector(
'.mdc-button.mdc-button--unelevated'
'.mdc-button.mdc-button--filled'
);

expect( matches ).toBeInTheDocument();
expect( screen.getByText( 'Container Color' ) ).toBeInTheDocument();
} );

it( 'should display an text with tonal style', () => {
setup( {
attributes: { type: 'text', elevationStyle: 'tonal' },
setAttributes: jest.fn(),
} );

const container = document.body;
const matches = container.querySelector(
'.mdc-button.mdc-button--tonal'
);

expect( matches ).toBeInTheDocument();
expect( screen.queryByText( 'Container Color' ) ).toBeNull();
} );

it( 'should display icon picker if icon position is set', () => {
setup( {
attributes: {
Expand Down

0 comments on commit ff6da1f

Please sign in to comment.