import { $ , browser , ElementFinder } from 'protractor' ; export class DateRangePickerPage { input = $ ( '#date-range-input' ) ; dateRangePicker = $ ( 'ux-date-range-picker' ) ; clearBtn = $ ( '#clear-btn' ) ; enableMinAndMaxBtn = $ ( '#enable-min-max' ) ; disableMinAndMaxBtn = $ ( '#disable-min-max' ) ; dateFormatBtn = $ ( '#date-format' ) ; timeFormatBtn = $ ( '#time-format' ) ; rangeHeader = $ ( '.range-header' ) ; secondsFormatBtn = $ ( '#show-seconds' ) ; async getPage ( ) { await browser . get ( '#/date-range-picker' ) ; } async getPicker ( picker ) { const pickers = await this . dateRangePicker . $$ ( 'ux-date-time-picker' ) ; return picker === Picker . Start ? pickers [ 0 ] : pickers [ 1 ] ; } async getInputText ( ) { return await this . input . getAttribute ( 'value' ) ; } async setInputText ( value ) { await this . input . setAttribute ( 'value' , value ) ; } async getRangeStart ( picker ) { const pickerElement = await this . getPicker ( picker ) ; return await pickerElement . $ ( '.range-start' ) . getAttribute ( 'innerText' ) ; } async clickOnRangeHeader ( ) { return await this . rangeHeader . click ( ) ; } async getRange ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const elements = await pickerElement . $$ ( '.range-between' ) ; const dates = [ ] ; for ( let idx = 0 ; idx < elements . length ; idx ++ ) { const element = elements [ idx ] ; dates . push ( await element . getAttribute ( 'innerText' ) ) ; } return dates ; } async getDisabled ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const elements = await pickerElement . $$ ( '.date-button' ) ; const dates = [ ] ; for ( let idx = 0 ; idx < elements . length ; idx ++ ) { const element = elements [ idx ] ; const date = await element . getAttribute ( 'innerHTML' ) ; const disabled = await element . getAttribute ( 'disabled' ) ; if ( disabled ) { dates . push ( date . trim ( ) ) ; } } return dates ; } async getRangeEnd ( picker ) { const pickerElement = await this . getPicker ( picker ) ; return await pickerElement . $ ( '.range-end' ) . getAttribute ( 'innerText' ) ; } async getPickerDateHeader ( picker ) { const headerIndex = ( picker === Picker . Start ) ? 0 : 1 ; const headers = await this . dateRangePicker . $$ ( '.header-section' ) ; const dateHeader = headers [ headerIndex ] . $ ( '.date-header' ) ; if ( await dateHeader . isPresent ( ) ) { return await dateHeader . getAttribute ( 'innerText' ) ; } return null ; } async getPickerTimeHeader ( picker ) { const headers = await this . dateRangePicker . $$ ( '.time-header' ) ; return await headers [ picker === Picker . Start ? 0 : 1 ] . getAttribute ( 'innerText' ) ; } async getPickerDuration ( ) { return await this . dateRangePicker . $ ( '.duration' ) . getAttribute ( 'innerText' ) ; } async selectDate ( picker , date ) { const pickerElement = await this . getPicker ( picker ) ; const elements = await pickerElement . $$ ( '.date-button' ) ; for ( let idx = 0 ; idx < elements . length ; idx ++ ) { const button = elements [ idx ] ; const label = await button . getAttribute ( 'innerText' ) ; const classes = await button . getAttribute ( 'class' ) ; if ( label === date . toString ( ) && classes . indexOf ( 'preview' ) === - 1 ) { return button . click ( ) ; } } } async incrementHour ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button' ) ; const spinner = spinners [ 0 ] ; const buttons = await spinner . $$ ( '.spin-button' ) ; return buttons [ 0 ] . click ( ) ; } async decrementHour ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button' ) ; const spinner = spinners [ 0 ] ; const buttons = await spinner . $$ ( '.spin-button' ) ; return buttons [ 1 ] . click ( ) ; } async incrementMinute ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button' ) ; const spinner = spinners [ 1 ] ; const buttons = await spinner . $$ ( '.spin-button' ) ; return buttons [ 0 ] . click ( ) ; } async decrementMinute ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button' ) ; const spinner = spinners [ 1 ] ; const buttons = await spinner . $$ ( '.spin-button' ) ; return buttons [ 1 ] . click ( ) ; } async getSpinnerHour ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button input' ) ; const spinner = spinners [ 0 ] ; return await spinner . getAttribute ( 'value' ) ; } async getSpinnerMinute ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button input' ) ; const spinner = spinners [ 1 ] ; return await spinner . getAttribute ( 'value' ) ; } async getSpinnerSecond ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinners = await pickerElement . $$ ( 'ux-spin-button input' ) ; const spinner = spinners [ 2 ] ; return await spinner . getAttribute ( 'value' ) ; } async incrementTimezone ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinner = await pickerElement . $ ( '.time-zone-spinner' ) ; const buttons = await spinner . $$ ( '.spin-button' ) ; return buttons [ 0 ] . click ( ) ; } async decrementTimezone ( picker ) { const pickerElement = await this . getPicker ( picker ) ; const spinner = await pickerElement . $ ( '.time-zone-spinner' ) ; const buttons = await spinner . $$ ( '.spin-button' ) ; return buttons [ 1 ] . click ( ) ; } async goToPreviousMonth ( picker ) { const datePicker = await this . getPicker ( picker ) ; const buttons = await datePicker . $$ ( '.header-navigation' ) ; await buttons [ 0 ] . click ( ) ; } async goToNextMonth ( picker ) { const datePicker = await this . getPicker ( picker ) ; const buttons = await datePicker . $$ ( '.header-navigation' ) ; await buttons [ 1 ] . click ( ) ; } async getPickerTitle ( picker ) { const datePicker = await this . getPicker ( picker ) ; return await datePicker . $ ( '.header-title' ) . getAttribute ( 'innerText' ) ; } async clear ( ) { await this . clearBtn . click ( ) ; } async enableMinAndMax ( ) { await this . enableMinAndMaxBtn . click ( ) ; } async disableMinAndMax ( ) { await this . disableMinAndMaxBtn . click ( ) ; } async enableDateFormat ( ) { await this . dateFormatBtn . click ( ) ; } async enableTimeFormat ( ) { await this . timeFormatBtn . click ( ) ; } async showSecondsFormat ( ) { await this . secondsFormatBtn . click ( ) ; } } export enum Picker { Start , End }