61 lines
1.7 KiB
JavaScript
61 lines
1.7 KiB
JavaScript
xcontext("Create Components", () => {
|
|
before(() => {
|
|
cy.server()
|
|
cy.visit(`localhost:${Cypress.env("PORT")}/_builder`)
|
|
// https://on.cypress.io/type
|
|
cy.createApp("Table App", "Table App Description")
|
|
cy.createTable("dog", "name", "age")
|
|
cy.addRow("bob", "15")
|
|
})
|
|
|
|
// https://on.cypress.io/interacting-with-elements
|
|
it("should add a container", () => {
|
|
cy.navigateToFrontend()
|
|
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)
|
|
)
|
|
}
|