Skip to content

Instantly share code, notes, and snippets.

@jpvincent
Created December 29, 2017 14:54
Show Gist options
  • Save jpvincent/446f7dd243b1576d05e0248909e9203c to your computer and use it in GitHub Desktop.
Save jpvincent/446f7dd243b1576d05e0248909e9203c to your computer and use it in GitHub Desktop.
Jest marche bien avec Webdriver, mais la syntaxe peut être lourde. On pourrait étendre l'assert de Jest pour intégrer les appels webdriver
// actuellement
expect(await browser.isSelected('[name=CustomClearanceRadios]'))
.toBe(true)
// proposition
expect.el('[name=CustomClearanceRadios]')
.toBeSelected()
// actuellement
expect(await browser.getValue('#ShipperEmail'))
.toBe('jp@made.this')
// proposition
expect.el('#ShipperEmail')
.toHaveValue('jp@made.this')
// actuellement
expect( await browser.getUrl() )
.toContain( '/recap.html' )
// proposition
expect( browser.getUrl() )
.toContain( '/recap.html' )
// actuellement
expect((await browser.elements('#freddie-sidebar .c-summary--item')).value.length)
.not.toEqual(10)
// proposition
expect.el('#freddie-sidebar .c-summary--item')
.not.toHaveLength(10)
// actuellement
expect(await browser.getAttribute('#freddie-sidebar .c-summary--total strong', 'innerText'))
.not.toEqual('10000')
// proposition
expect.el('#freddie-sidebar .c-summary--total strong')
.attribute('innerText')
.not.toEqual('10000')
// actuellement
expect(await browser.getText('#freddie-sidebar .c-summary--total strong'))
.not.toEqual('10000')
// proposition
expect.el('#freddie-sidebar .c-summary--total strong')
.text()
.not.toEqual('10000')
// actuellement
expect(await browser.getAttribute( ResultsList+':nth-child(1)', 'class'))
.toContain('is-highlighted')
// proposition
expect.el(ResultsList+':nth-child(1)')
.attribute('class')
.toContain('is-highlighted')
// actuellement
expect(await browser.isVisible('.c-customcargoprotection--loader'))
.toBe(false)
// proposition
expect.el('.c-customcargoprotection--loader')
.not.toBeVisible()
// actuellement
expect(await browser.waitForVisible('.label span:first-child', 3000))
.toBe(true)
// proposition
expect.el('.label span:first-child')
.toBeVisible(3000)
@jpvincent
Copy link
Author

Pour un peu de contexte, voici à quoi ressemble un test aujourd'hui avec Jest + Webdriver. browser est un pointeur vers Webdriver. Les await browser du pilotage navigateur ne m'ont pas l'air évitable, je cherche juste à améliorer les expect

describe('E2E Autocomplete', () => {

	// une même session pour tous les tests …
	beforeAll(()=> browser.init())
	afterAll(()=> browser.end())

	it('Sélectionne un autocomplete à la souris', async () => {
		const {POLInput, ResultsList} = pageSearch.elements
		await browser
			.setValue(POLInput, 'Mar')
			.waitForExist( ResultsList, 3000 )
		await browser.click(ResultsList+':nth-child(1)')
		expect(await browser.getValue(POLInput))
			.toBe('Marseille')
	})

@jpvincent
Copy link
Author

jpvincent commented Dec 29, 2017

Pour comparaison, voici à quoi ressemble un test Nightwatch :

  it('highlights the 2nd item when the down key is pressed once', (client) => {
    client
      .setValue(PODInput, keywords.manyResults)
      .waitForElementPresent( ResultsList, 3000 )
    // on vérifie que le 1er item est déjà en surbrillance
    client
      .expect.element(ResultsList+':nth-child(1)')
        .to.have.attribute('class')
        .to.contains('is-highlighted')
    // key down : https://w3c.github.io/webdriver/webdriver-spec.html#keyboard-actions
    //console.log(client.Keys)
    client.keys(client.Keys.ARROW_DOWN)//'\uE015')
    client.expect.element(ResultsList+':nth-child(2)')
        .to.have.attribute('class')
        .to.contains('is-highlighted')

  })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment