1
0
Fork 0
mirror of synced 2024-07-04 05:50:57 +12:00
budibase/packages/builder/cypress/integration/createComponents.spec.js
Martin McKeaveney bbcb282e53
Cypress Tests Running in CI (#524)
* cypress test setup

* running cypress in CI

* fixing tests after first time setup wizard

* bb api key

* API Key in right place

* adding env in cypress.json

* env var in setup

* lint

* API key not working

* fill in API key form if present

* allow more time for creation

* cypress server for debug

* video recording, better debugging

* Adding debug logs

* set node env

* cypress env

* cancel irrelevant test
2020-08-05 15:18:28 +01:00

54 lines
1.8 KiB
JavaScript

xcontext('Create Components', () => {
before(() => {
cy.server()
cy.visit('localhost:4001/_builder')
// https://on.cypress.io/type
cy.createApp('Model App', 'Model App Description')
cy.createModel('dog', 'name', 'age')
cy.addRecord('bob', '15')
})
// https://on.cypress.io/interacting-with-elements
it('should add a container', () => {
cy.contains('frontend').click()
cy.get('.switcher > :nth-child(2)').click()
cy.contains('Container').click()
})
it('should add a headline', () => {
cy.addHeadlineComponent('An Amazing headline!')
getIframeBody().contains('An Amazing headline!')
})
it('change the font size of the headline', () => {
cy.contains('Typography').click()
cy.get('[data-cy=font-size-prop-control]').click()
cy.contains("60px").click()
cy.contains('Design').click()
getIframeBody().contains('An Amazing headline!').should('have.css', 'font-size', '60px')
})
})
const getIframeDocument = () => {
return cy
.get('iframe')
// Cypress yields jQuery element, which has the real
// DOM element under property "0".
// From the real DOM iframe element we can get
// the "document" element, it is stored in "contentDocument" property
// Cypress "its" command can access deep properties using dot notation
// https://on.cypress.io/its
.its('0.contentDocument').should('exist')
}
const getIframeBody = () => {
// get the document
return getIframeDocument()
// automatically retries until body is loaded
.its('body').should('not.be.undefined')
// wraps "body" DOM element to allow
// chaining more Cypress commands, like ".find(...)"
.then(cy.wrap)
}