MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

full cypress suite for custom views

This commit is contained in:
Martin McKeaveney 2020-08-19 16:43:04 +01:00
parent e57dda576b
commit 80970ba035
15 changed files with 114 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
packages/builder/cypress/integration/createView.spec.js Normal file
View File

@ -0,0 +1,85 @@
context('Create a View', () => {
before(() => {
cy.visit('localhost:4001/_builder')
cy.createApp('View App', 'View App Description')
cy.createTable('data')
cy.addColumn('data', 'group', 'Plain Text')
cy.addColumn('data', 'age', 'Number')
cy.addColumn('data', 'rating', 'Number')
cy.addRecord(["Students", 25, 1])
cy.addRecord(["Students", 20, 3])
cy.addRecord(["Students", 18, 6])
cy.addRecord(["Students", 25, 2])
cy.addRecord(["Teachers", 49, 5])
cy.addRecord(["Teachers", 36, 3])
})
it('creates a stats view based on age', () => {
cy.contains("Create New View").click()
cy.get("[placeholder='View Name']").type("Test View")
cy.contains("Save View").click()
cy.get("thead th").should(($headers) => {
expect($headers).to.have.length(7)
const headers = $headers.map((i, header) => Cypress.$(header).text())
expect(headers.get()).to.deep.eq([
"group",
"sum",
"min",
"max",
"sumsqr",
"count",
"avg",
])
})
cy.get("tbody td").should(($values) => {
const values = $values.map((i, value) => Cypress.$(value).text())
expect(values.get()).to.deep.eq([
"null",
"173",
"18",
"49",
"5671",
"6",
"28.833333333333332"
])
})
})
it('groups the stats view by group', () => {
cy.contains("Group By").click()
cy.get("select").select("group")
cy.contains("Save").click()
cy.contains("Students").should("be.visible")
cy.contains("Teachers").should("be.visible")
cy.get("tbody tr").first().find("td").should(($values) => {
const values = $values.map((i, value) => Cypress.$(value).text())
expect(values.get()).to.deep.eq([
"Students",
"88",
"18",
"25",
"1974",
"4",
"22"
])
})
})
it('renames a view', () => {
cy.contains("[data-cy=model-nav-item]", "Test View").find(".ri-more-line").click()
cy.contains("Edit").click()
cy.get("[placeholder='View Name']").type(" Updated")
cy.contains("Save").click()
cy.contains("Test View Updated").should("be.visible")
})
it('deletes a view', () => {
cy.contains("[data-cy=model-nav-item]", "Test View Updated").find(".ri-more-line").click()
cy.contains("Delete").click()
cy.get(".content").contains("button", "Delete").click()
cy.contains("TestView Updated").should("not.be.visible")
})
})

2
packages/builder/package.json
View File

@ -57,7 +57,7 @@
]
},
"dependencies": {
"@budibase/bbui": "^1.24.0",
"@budibase/bbui": "^1.24.1",
"@budibase/client": "^0.1.17",
"@budibase/colorpicker": "^1.0.1",
"@nx-js/compiler-util": "^2.0.0",

4
packages/builder/src/builderStore/store/backend.js
View File

@ -118,10 +118,6 @@ export const getBackendUiStore = () => {
}),
delete: async view => {
await api.delete(`/api/views/${view}`)
store.update(state => {
store.actions.models.select(state.models[0])
return state
})
await store.actions.models.fetch()
},
save: async view => {

1
packages/builder/src/components/database/DataTable/ModelDataTable.svelte
View File

@ -176,6 +176,7 @@
.popovers {
display: flex;
gap: var(--spacing-l);
}
.no-data {

10
packages/builder/src/components/database/DataTable/Table.svelte
View File

@ -105,15 +105,6 @@
vertical-align: middle;
}
.edit-header {
width: 100px;
cursor: default;
}
.edit-header:hover {
color: var(--ink);
}
th:hover {
color: var(--blue);
cursor: pointer;
@ -142,6 +133,7 @@
.popovers {
display: flex;
gap: var(--spacing-l);
}
.no-data {

7
packages/builder/src/components/database/DataTable/ViewDataTable.svelte
View File

@ -21,7 +21,7 @@
let COLUMNS = [
{
name: "Group",
name: "group",
key: "key",
},
{
@ -54,9 +54,10 @@
let data = []
$: !view.name.startsWith("all_") && fetchViewData(view)
$: ({ name, groupBy } = view)
$: !name.startsWith("all_") && fetchViewData(name, groupBy)
async function fetchViewData({ name, groupBy }) {
async function fetchViewData(name, groupBy) {
let QUERY_VIEW_URL = `/api/views/${name}?stats=true`
if (groupBy) {
QUERY_VIEW_URL += `&group=${groupBy}`

4
packages/builder/src/components/database/DataTable/modals/DeleteView.svelte
View File

@ -1,4 +1,5 @@
<script>
import { goto } from "@sveltech/routify"
import ActionButton from "components/common/ActionButton.svelte"
import { notifier } from "builderStore/store/notifications"
import { store, backendUiStore } from "builderStore"
@ -25,7 +26,8 @@
alert
on:click={async () => {
await backendUiStore.actions.views.delete(viewName)
notifier.danger('View deleted')
notifier.danger(`View ${viewName} deleted.`)
$goto(`./backend`)
onClosed()
}}>
Delete

6
packages/builder/src/components/database/DataTable/popovers/Calculate.svelte
View File

@ -1,5 +1,5 @@
<script>
import { Popover, Button, Icon, Input, Select } from "@budibase/bbui"
import { Popover, TextButton, Button, Icon, Input, Select } from "@budibase/bbui"
import { backendUiStore } from "builderStore"
import { notifier } from "builderStore/store/notifications"
import CreateEditRecord from "../modals/CreateEditRecord.svelte"
@ -33,10 +33,10 @@
</script>
<div bind:this={anchor}>
<Button text small on:click={dropdown.show}>
<TextButton text small on:click={dropdown.show} active={!!view.field}>
<Icon name="calculate" />
Calculate
</Button>
</TextButton>
</div>
<Popover bind:this={dropdown} {anchor} align="left">
<h5>Calculate</h5>

2
packages/builder/src/components/database/DataTable/popovers/Column.svelte
View File

@ -1,6 +1,6 @@
<script>
import { backendUiStore } from "builderStore"
import { DropdownMenu, Button, Icon, Input, Select } from "@budibase/bbui"
import { DropdownMenu, TextButton as Button, Icon, Input, Select } from "@budibase/bbui"
import { FIELDS } from "constants/backend"
import CreateEditColumn from "../modals/CreateEditColumn.svelte"

10
packages/builder/src/components/database/DataTable/popovers/GroupBy.svelte
View File

@ -1,5 +1,5 @@
<script>
import { Popover, Button, Icon, Input, Select } from "@budibase/bbui"
import { Popover, TextButton, Button, Icon, Input, Select } from "@budibase/bbui"
import { backendUiStore } from "builderStore"
import { notifier } from "builderStore/store/notifications"
import CreateEditRecord from "../modals/CreateEditRecord.svelte"
@ -29,17 +29,17 @@
</script>
<div bind:this={anchor}>
<Button text small on:click={dropdown.show}>
<Icon name="calculate" />
<TextButton text small active={!!view.groupBy} on:click={dropdown.show}>
<Icon name="group" />
Group By
</Button>
</TextButton>
</div>
<Popover bind:this={dropdown} {anchor} align="left">
<h5>Group By</h5>
<div class="input-group-row">
<p>Group By</p>
<Select secondary thin bind:value={view.groupBy}>
<option value={false}>Remove Group By</option>
<option value={false}/>
{#each fields as field}
<option value={field}>{field}</option>
{/each}

2
packages/builder/src/components/database/DataTable/popovers/Row.svelte
View File

@ -1,5 +1,5 @@
<script>
import { DropdownMenu, Button, Icon } from "@budibase/bbui"
import { DropdownMenu, TextButton as Button, Icon } from "@budibase/bbui"
import CreateEditRecord from "../modals/CreateEditRecord.svelte"
let anchor

6
packages/builder/src/components/database/DataTable/popovers/View.svelte
View File

@ -1,5 +1,5 @@
<script>
import { Popover, Button, Icon, Input, Select } from "@budibase/bbui"
import { Popover, TextButton, Button, Icon, Input, Select } from "@budibase/bbui"
import { goto } from "@sveltech/routify"
import { backendUiStore } from "builderStore"
import { notifier } from "builderStore/store/notifications"
@ -33,10 +33,10 @@
</script>
<div bind:this={anchor}>
<Button text small on:click={dropdown.show}>
<TextButton text small on:click={dropdown.show}>
<Icon name="addrow" />
Create New View
</Button>
</TextButton>
</div>
<Popover bind:this={dropdown} {anchor} align="left">
<h5>Create View</h5>

2
packages/builder/src/components/nav/ModelNavigator/EditView.svelte
View File

@ -54,7 +54,7 @@
{#if editing}
<h5>Edit View</h5>
<div class="container">
<Input placeholder="Table Name" thin bind:value={view.name} />
<Input placeholder="View Name" thin bind:value={view.name} />
</div>
<footer>
<div class="button-margin-3">

2
packages/builder/src/components/nav/ModelNavigator/ListItem.svelte
View File

@ -6,7 +6,7 @@
export let indented
</script>
<div class:indented class:selected on:click class={className}>
<div data-cy="model-nav-item" class:indented class:selected on:click class={className}>
<i class={icon} />
<span>{title}</span>
<slot />

8
packages/builder/yarn.lock
View File

@ -775,10 +775,10 @@
lodash "^4.17.13"
to-fast-properties "^2.0.0"
"@budibase/bbui@^1.24.0":
version "1.24.0"
resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.24.0.tgz#8e41d808c2b73fe63d39ad8120ee3ef2a6ce5893"
integrity sha512-mARLxLASvqIo33xyYnm8YE+bIR3ncuG1KhSUaxXmFIchsdhVWQUDUX3adE23LU9HR6g+tnvsKtnw5N43grydTw==
"@budibase/bbui@^1.24.1":
version "1.24.1"
resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.24.1.tgz#d1c527990c3dcdef78080abfe6aaeef6e8fb2d66"
integrity sha512-yZE4Uk6EB3MoIUd2oNN50u8KOXRX65yRFv49gN0T6iCjTjEAdEk8JtsQR9AL3VWn3EdPz5xOkrGsIvNtxqaAFw==
dependencies:
sirv-cli "^0.4.6"