Cypress Testing additions and changes

-Changing baseurl to be the test env
-Made a few updates to existing tests/commands
--New commands also added
-Add Radio Button Test
-Add Multi Option Datatype test
-Custom Theming Properties Test
--Just the one so far, more to come
This commit is contained in:
Mitch-Budibase 2021-09-27 18:19:25 +01:00
parent 6a48cff5d5
commit b6f8d74e01
9 changed files with 200 additions and 15 deletions

View File

@ -1,5 +1,5 @@
{
"baseUrl": "http://localhost:10001/builder/",
"baseUrl": "https://test.budi.live/builder/",
"video": true,
"projectId": "bmbemn",
"env": {

View File

@ -0,0 +1,40 @@
context("Add Multi-Option Datatype", () => {
before(() => {
cy.login()
cy.createTestApp()
})
it("should create a new table, with data", () => {
cy.createTable("Multi Data")
cy.addColumn("Multi Data", "Test Data", "Multi-select", "1\n2\n3\n4\n5")
cy.addRowMultiValue(["1", "2", "3", "4", "5"])
})
it ("should add form with multi select picker, containing 5 options", () => {
cy.navigateToFrontend()
cy.wait(500)
// Add data provider
cy.get(`[data-cy="category-Data Provider"]`).click()
cy.get('[data-cy="dataSource-prop-control"]').click()
cy.get(".dropdown").contains("Multi Data").click()
cy.wait(500)
// Add Form with schema to match table
cy.addComponent("Form", "Form")
cy.get('[data-cy="dataSource-prop-control"').click()
cy.get(".dropdown").contains("Multi Data").click()
cy.wait(500)
// Add multi-select picker to form
cy.addComponent("Form", "Multi-select Picker").then((componentId) => {
cy.get('[data-cy="field-prop-control"]').type("Test Data").type('{enter}')
cy.getComponent(componentId).click()
// Check picker has 5 items
cy.getComponent(componentId).find('li').should('have.length', 5)
// Select all items
for (let i = 1; i < 6; i++) {
cy.getComponent(componentId).find('li').contains(i).click()
}
// Check items have been selected
cy.getComponent(componentId).find('.spectrum-Picker-label').contains("(5)")
})
})
})

View File

@ -0,0 +1,39 @@
context("Add Radio Buttons", () => {
before(() => {
cy.login()
cy.createTestApp()
})
it("should add Radio Buttons options picker on form, add data, and confirm", () => {
cy.navigateToFrontend()
cy.addComponent("Form", "Form")
cy.addComponent("Form", "Options Picker").then((componentId) => {
// Provide field setting
cy.get(`[data-cy="field-prop-control"]`).type("1")
// Open dropdown and select Radio buttons
cy.get(`[data-cy="optionsType-prop-control"]`).click().then(() => {
cy.get('.spectrum-Popover').contains('Radio buttons')
.wait(500)
.click()
})
const radioButtonsTotal = 3
// Add values and confirm total
addRadioButtonData(radioButtonsTotal)
cy.getComponent(componentId).find('[type="radio"]')
.should('have.length', radioButtonsTotal)
})
})
const addRadioButtonData = (totalRadioButtons) => {
cy.get(`[data-cy="optionsSource-prop-control"]`).click().then(() => {
cy.get('.spectrum-Popover').contains('Custom')
.wait(500)
.click()
})
cy.addCustomSourceOptions(totalRadioButtons)
}
})

View File

@ -2,7 +2,7 @@ context("Create an Application", () => {
it("should create a new application", () => {
cy.login()
cy.createTestApp()
cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
cy.visit(`https://test.budi.live/builder`)
cy.contains("Cypress Tests").should("exist")
})
})

View File

@ -38,7 +38,7 @@ context("Create a Table", () => {
cy.wait(1000)
cy.get(".spectrum-Modal input").type("Updated")
cy.contains("Save").click()
cy.contains("RoverUpdated").should("have.text", "RoverUpdated")
cy.contains("Updated").should("have.text", "Updated")
})
it("deletes a row", () => {

View File

@ -1,3 +1,7 @@
Cypress.on('uncaught:exception', (err, runnable) => {
return false;
});
context("Create a View", () => {
before(() => {
cy.login()
@ -57,6 +61,7 @@ context("Create a View", () => {
})
it("creates a stats calculation view based on age", () => {
cy.wait(1000)
cy.contains("Calculate").click()
cy.get(".modal-inner-wrapper").within(() => {
cy.get(".spectrum-Picker-label").eq(0).click()
@ -65,7 +70,7 @@ context("Create a View", () => {
cy.get(".spectrum-Picker-label").eq(1).click()
cy.contains("age").click({ force: true })
cy.contains("Save").click()
cy.get(".spectrum-Button").contains("Save").click({ force: true })
})
cy.wait(1000)
@ -126,7 +131,7 @@ context("Create a View", () => {
cy.contains(".nav-item", "Test View")
.find(".actions .icon")
.click({ force: true })
cy.contains("Edit").click()
cy.get(".spectrum-Menu-itemLabel").contains("Edit").click()
cy.get(".modal-inner-wrapper").within(() => {
cy.get("input").type(" Updated")
cy.contains("Save").click()
@ -141,8 +146,8 @@ context("Create a View", () => {
.click({ force: true })
cy.contains("Delete").click()
cy.contains("Delete View").click()
cy.wait(1000)
cy.contains("TestView Updated").should("not.be.visible")
cy.wait(500)
cy.contains("TestView Updated").should("not.exist")
})
})

View File

@ -0,0 +1,61 @@
context("Custom Theming Properties", () => {
before(() => {
cy.login()
cy.createTestApp()
cy.navigateToFrontend()
})
// Default Values
// Button roundness = Large
// Primary colour = Blue 600
// Primary colour (hover) = Blue 500
// Navigation bar background colour = Gray 100
// Navigation bar text colour = Gray 800
it("should reset the color property values", () => {
// Open Theme modal and change colours
cy.get(".spectrum-ActionButton-label").contains("Theme").click()
cy.get(".spectrum-Picker").contains("Large").click()
.parents()
.get(".spectrum-Menu-itemLabel").contains("None").click()
changeThemeColors()
// Reset colours
cy.get(".spectrum-Button-label").contains("Reset").click({force: true})
// Check values have reset
checkThemeColorDefaults()
})
const changeThemeColors = () => {
// Changes the theme colours
cy.get(".spectrum-FieldLabel").contains("Primary color")
.parent().find(".container.svelte-z3cm5a").click()
.find('[title="Red 400"]').click()
cy.get(".spectrum-FieldLabel").contains("Primary color (hover)")
.parent().find(".container.svelte-z3cm5a").click()
.find('[title="Orange 400"]').click()
cy.get(".spectrum-FieldLabel").contains("Navigation bar background color")
.parent().find(".container.svelte-z3cm5a").click()
.find('[title="Yellow 400"]').click()
cy.get(".spectrum-FieldLabel").contains("Navigation bar text color")
.parent().find(".container.svelte-z3cm5a").click()
.find('[title="Green 400"]').click()
}
const checkThemeColorDefaults = () => {
cy.get(".spectrum-FieldLabel").contains("Primary color")
.parent().find(".container.svelte-z3cm5a").click()
.get('[title="Blue 600"]').children().find('[aria-label="Checkmark"]')
cy.get(".spectrum-Dialog-grid").click()
cy.get(".spectrum-FieldLabel").contains("Primary color (hover)")
.parent().find(".container.svelte-z3cm5a").click()
.get('[title="Blue 500"]').children().find('[aria-label="Checkmark"]')
cy.get(".spectrum-Dialog-grid").click()
cy.get(".spectrum-FieldLabel").contains("Navigation bar background color")
.parent().find(".container.svelte-z3cm5a").click()
.get('[title="Gray 100"]').children().find('[aria-label="Checkmark"]')
cy.get(".spectrum-Dialog-grid").click()
cy.get(".spectrum-FieldLabel").contains("Navigation bar text color")
.parent().find(".container.svelte-z3cm5a").click()
.get('[title="Gray 800"]').children().find('[aria-label="Checkmark"]')
}
})

View File

@ -16,7 +16,7 @@ process.env.PORT = MAIN_PORT
process.env.JWT_SECRET = cypressConfig.env.JWT_SECRET
process.env.COUCH_URL = `leveldb://${tmpdir}/.data/`
process.env.SELF_HOSTED = 1
process.env.WORKER_URL = "http://localhost:10002/"
process.env.WORKER_URL = "https://test.budi.live/"
process.env.MINIO_URL = `http://localhost:${MAIN_PORT}/`
process.env.MINIO_ACCESS_KEY = "budibase"
process.env.MINIO_SECRET_KEY = "budibase"

View File

@ -6,8 +6,8 @@
//
Cypress.Commands.add("login", () => {
cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
cy.wait(500)
cy.visit(`https://test.budi.live/builder`)
cy.wait(2000)
cy.url().then(url => {
if (url.includes("builder/admin")) {
// create admin user
@ -22,15 +22,17 @@ Cypress.Commands.add("login", () => {
cy.get("input").first().type("test@test.com")
cy.get('input[type="password"]').type("test")
cy.get("button").first().click()
cy.wait(1000)
})
}
})
})
Cypress.Commands.add("createApp", name => {
cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
cy.visit(`https://test.budi.live/builder`)
cy.wait(500)
cy.contains(/Create (new )?app/).click()
cy.wait(500)
cy.get(".spectrum-Modal")
.within(() => {
cy.get("input").eq(0).type(name).should("have.value", name).blur()
@ -43,9 +45,9 @@ Cypress.Commands.add("createApp", name => {
})
Cypress.Commands.add("deleteApp", () => {
cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
cy.visit(`https://test.budi.live/builder`)
cy.wait(1000)
cy.request(`localhost:${Cypress.env("PORT")}/api/applications?status=all`)
cy.request(`https://test.budi.live/api/applications?status=all`)
.its("body")
.then(val => {
console.log(val)
@ -80,7 +82,7 @@ Cypress.Commands.add("createTable", tableName => {
cy.contains(tableName).should("be.visible")
})
Cypress.Commands.add("addColumn", (tableName, columnName, type) => {
Cypress.Commands.add("addColumn", (tableName, columnName, type, multiOptions = null) => {
// Select Table
cy.selectTable(tableName)
cy.contains(".nav-item", tableName).click()
@ -95,6 +97,11 @@ Cypress.Commands.add("addColumn", (tableName, columnName, type) => {
cy.get(".spectrum-Picker-label").click()
cy.contains(type).click()
// Add options for Multi-select Type
if(multiOptions !== null){
cy.get(".spectrum-Textfield-input").eq(1).type(multiOptions)
}
cy.contains("Save Column").click()
})
})
@ -109,6 +116,19 @@ Cypress.Commands.add("addRow", values => {
})
})
Cypress.Commands.add("addRowMultiValue", values => {
cy.contains("Create row").click()
cy.get(".spectrum-Form-itemField").click().then(() => {
cy.get(".spectrum-Popover").within(() => {
for (let i = 0; i < values.length; i++) {
cy.get(".spectrum-Menu-item").eq(i).click()
}
})
cy.get(".spectrum-Dialog-grid").click('top')
cy.get(".spectrum-ButtonGroup").contains("Create").click()
})
})
Cypress.Commands.add("createUser", email => {
// quick hacky recorded way to create a user
cy.contains("Users").click()
@ -127,7 +147,9 @@ Cypress.Commands.add("addComponent", (category, component) => {
if (category) {
cy.get(`[data-cy="category-${category}"]`).click()
}
if (component){
cy.get(`[data-cy="component-${component}"]`).click()
}
cy.wait(1000)
cy.location().then(loc => {
const params = loc.pathname.split("/")
@ -149,8 +171,11 @@ Cypress.Commands.add("getComponent", componentId => {
})
Cypress.Commands.add("navigateToFrontend", () => {
// Clicks on Design tab and then the Home nav item
cy.wait(1000)
cy.contains("Design").click()
cy.get(".spectrum-Search").type("/")
cy.get(".nav-item").contains("Home").click()
})
Cypress.Commands.add("createScreen", (screenName, route) => {
@ -173,3 +198,18 @@ Cypress.Commands.add("selectTable", tableName => {
cy.expandBudibaseConnection()
cy.contains(".nav-item", tableName).click()
})
Cypress.Commands.add("addCustomSourceOptions", totalOptions => {
cy.get(".spectrum-ActionButton").contains("Define Options").click().then(() => {
for (let i = 0; i < totalOptions; i++) {
// Add radio button options
cy.get(".spectrum-Button").contains("Add Option").click({force: true}).then(() => {
cy.wait(500)
cy.get("[placeholder='Label']").eq(i).type(i)
cy.get("[placeholder='Value']").eq(i).type(i)
})
}
// Save options
cy.get(".spectrum-Button").contains("Save").click({force: true})
})
})