import { browser , by , element , ElementFinder } from 'protractor' ; export class FlippableCardsPage { async getPage ( ) { await browser . get ( '#/flippable-cards' ) ; } flippableCard1 = element ( by . id ( 'flippableCard1' ) ) ; flippableCard2 = element ( by . id ( 'flippableCard2' ) ) ; flippableCard3 = element ( by . id ( 'flippableCard3' ) ) ; confirmIsFlipped ( card ) { return card . $ ( 'div.ux-flip-card' ) . isPresent ( ) ; } clickOnCard ( card , offset ) { return browser . actions ( ) . mouseMove ( card , offset ) . mouseDown ( ) . mouseUp ( ) . perform ( ) ; } clickOnCardIcon ( card ) { return this . confirmIsFlipped ( card ) . then ( function ( isFlipped ) { if ( isFlipped ) { card . $ ( 'div.ux-flipper' ) . $ ( 'div.ux-flippable-card-back' ) . $ ( 'ux-flippable-card-back' ) . $ ( 'ux-icon' ) . click ( ) ; } else { card . $ ( 'div.ux-flipper' ) . $ ( 'div.ux-flippable-card-front' ) . $ ( 'ux-flippable-card-front' ) . $ ( 'ux-icon' ) . click ( ) ; } } ) ; } getCardDimension ( card , attribute ) { return card . getAttribute ( attribute ) ; } hoverOverCard ( card , offset ) { return browser . actions ( ) . mouseMove ( card , offset ) . perform ( ) ; } }