import { And , Then , When } from 'cypress-cucumber-preprocessor/steps' ; Then ( 'spellcheck component is shown and its button contains the spellchecked query {string}' , ( spellcheckedQuery ) => { cy . getByDataTest ( 'spellcheck' ) . should ( 'exist' ) . getByDataTest ( 'set-spellcheck' ) . invoke ( 'text' ) . should ( 'eq' , spellcheckedQuery ) ; } ) ; Then ( 'spellcheck component is not shown' , ( ) => { cy . getByDataTest ( 'spellcheck' ) . should ( 'not.exist' ) ; } ) ; When ( 'spellcheck button is clicked' , ( ) => { cy . getByDataTest ( 'set-spellcheck' ) . click ( ) . invoke ( 'text' ) . as ( 'spellcheckedQuery' ) ; } ) ; Then ( 'the spellchecked query is displayed in the search-box' , function ( this ) { cy . getByDataTest ( 'search-input' ) . should ( 'have.value' , this . spellcheckedQuery ) ; } ) ; And ( 'spellcheck button contains the spellchecked query {string}' , ( spellcheckedQuery ) => { cy . getByDataTest ( 'set-spellcheck' ) . invoke ( 'text' ) . should ( 'eq' , spellcheckedQuery ) ; } ) ;