mirror of https://github.com/Budibase/budibase.git
Browse Source
-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 comepull/2783/head
Mitch-Budibase
5 years ago
9 changed files with 200 additions and 15 deletions
@ -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)") |
|||
}) |
|||
}) |
|||
}) |
|||
@ -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) |
|||
} |
|||
}) |
|||
|
|||
|
|||
|
|||
|
|||
@ -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"]') |
|||
} |
|||
|
|||
}) |
|||
Loading…
Reference in new issue