Skip to content

Commit

Permalink
feat: create and edit rows from tables interactive widget
Browse files Browse the repository at this point in the history 
Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: set store in widget

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: properly access store to create new row

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: search functionality

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: row reactivity

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

feat: add component testing skeleton files

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

test: start component testing for content reference widget

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: point package.json scripts to webpack.config.js

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix(test): properly mount component

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix(test): use default options and mix in given mount options

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix(tests): add styles for components

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

refactor(tests): move richObject to fixture

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

test: verify table title after mounting component

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

test: test searching in widget

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

refactor(tests): organize mount test

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: resolve pagination issues

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: change viewport dimensions in cypress config

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix: refine row selector

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

feat: create and edit rows from tables interactive widget

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix(css): edit row delete & save buttons

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

fix(css): fullscreen rich text edit

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>
  • Loading branch information
@elzody
elzody committed May 31, 2024
1 parent 185bfe4 commit eae0c48
Show file tree
Hide file tree
Showing 222 changed files with 3,456 additions and 41 deletions.
12 changes: 11 additions & 1 deletion cypress.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,21 @@ const { defineConfig } = require('cypress')

module.exports = defineConfig({
projectId: 'ixbf9n',

e2e: {
baseUrl: 'http://nextcloud.local/index.php/',
setupNodeEvents(on, config) {
// implement node event listeners here
},
pageLoadTimeout: 120000,
pageLoadTimeout: 120000,
},

component: {
devServer: {
framework: 'vue',
bundler: 'webpack',
},
viewportWidth: 800,
viewportHeight: 600,
},
})
110 changes: 110 additions & 0 deletions cypress/component/ContentReferenceWidget.cy.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,110 @@
import ContentReferenceWidget from '../../src/views/ContentReferenceWidget.vue'

describe('ContentReferenceWidget', () => {
let richObject = {}

before(() => {
// Load the richObject from a fixture
cy.fixture('widgets/richObject.json')
.then(richObjectFixture => {
richObject = richObjectFixture
})
})

it('mounts', () => {
mountContentWidget(richObject)

const title = `${richObject.emoji} ${richObject.title}`

// Verify the table loaded the richObject
// by checking the title
cy.get('.tables-content-widget h2').as('heading')
cy.get('@heading').contains(title)
})

it('can search rows', () => {
mountContentWidget(richObject)

const searchTerm = 'cat'

// Search for the row including the above search term
cy.get('@options').find('input').type(searchTerm)

// Ensure there is only one resultant row and
// verify the row correctly includes the search term
cy.get('@rows').its('length').should('equal', 1)
cy.get('@rows').first().as('firstRow')
cy.get('@firstRow').children().first().contains(searchTerm, { matchCase: false })
})

it('can create a row', () => {
mountContentWidget(richObject);

// Load a fixture used to reply to the create row request
cy.fixture('widgets/createRow.json')
.then((rowData) => {
cy.reply('**/index.php/apps/tables/row', rowData)
})

// Click the Create Row button
cy.get('@options').find('button').click()

// Input row data
cy.get('[data-cy="Name"] input').type('Hello')
cy.get('[data-cy="Account manager"] input').type('World')

// Create the row and make sure the modal disappears
cy.get('[data-cy="createRowSaveButton"]').click()
cy.get('.modal__content').should('not.exist')

// Make sure the row was added and is visible
cy.get('@rows').last().children().as('createdRow')
cy.get('@createdRow').first().contains('Hello')
cy.get('@createdRow').next().contains('World')
})

it('can edit a row', () => {
mountContentWidget(richObject)

// Load a fixture which is used to reply to the edit row request
cy.fixture('widgets/editRow.json')
.then((rowData) => {
cy.reply('**/index.php/apps/tables/row/*', rowData)
})

// Click the edit button on the first row
cy.get('@rows').first().find('td.sticky button').click({ force: true })

// Get the first field of the Edit Row modal
cy.get('.modal__content').as('editRowModal')
cy.get('@editRowModal').find('.row.space-T').as('fields')
cy.get('@fields').first().find('input').as('editNameField')

// Clear the current input and enter a new value
cy.get('@editNameField').clear()
cy.get('@editNameField').type('Giraffe')

// Edit the row and make sure the modal disappears
cy.get('[data-cy="editRowSaveButton"]').click()
cy.get('@editRowModal').should('not.exist')

// Check the edited row for the new value
cy.get('@rows').first().children().as('editedRow')
cy.get('@editedRow').first().contains('Giraffe')
})
})

function mountContentWidget(richObject) {
cy.reply('**/index.php/apps/tables/row/table/*', richObject.rows)

cy.mount(ContentReferenceWidget, {
propsData: {
richObject,
},
})

// Get some often used elements
cy.get('.tables-content-widget > .options').as('options')
cy.get('.tables-content-widget .NcTable table').as('table')
cy.get('@table').find('tbody tr[data-cy="customTableRow"]').as('rows')
}
2 changes: 1 addition & 1 deletion cypress/e2e/column-selection.cy.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ describe('Test column ' + columnTitle, () => {
cy.get('.modal__content h2').contains('Create row').should('be.visible')
cy.get('.modal__content .title').contains(columnTitle).should('be.visible')
cy.get('.modal__content .title').click()
cy.get('.modal__content .select span[title="second option"]').should('be.visible')
cy.get('.vs__dropdown-toggle .vs__selected span[title="second option"]').should('exist')
cy.get('button').contains('Save').click()
cy.get('.custom-table table tr td div').contains('second option').should('be.visible')

Expand Down
42 changes: 42 additions & 0 deletions cypress/fixtures/widgets/createRow.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
{
"id": 229,
"tableId": 49,
"createdBy": null,
"createdAt": null,
"lastEditBy": null,
"lastEditAt": null,
"data": [
{
"columnId": 159,
"value": "Hello"
},
{
"columnId": 160,
"value": "World"
},
{
"columnId": 161,
"value": ""
},
{
"columnId": 162,
"value": "2024-05-30"
},
{
"columnId": 164,
"value": ""
},
{
"columnId": 165,
"value": ""
},
{
"columnId": 166,
"value": 30
},
{
"columnId": 167,
"value": ""
}
]
}
46 changes: 46 additions & 0 deletions cypress/fixtures/widgets/editRow.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
{
"id": 226,
"tableId": 49,
"createdBy": null,
"createdAt": null,
"lastEditBy": null,
"lastEditAt": null,
"data": [
{
"columnId": 159,
"value": "Giraffe"
},
{
"columnId": 160,
"value": "Mr. Smith"
},
{
"columnId": 161,
"value": "Dog food every week"
},
{
"columnId": 162,
"value": "2023-01-01"
},
{
"columnId": 163,
"value": "2023-12-31"
},
{
"columnId": 164,
"value": "The dog is our best friend."
},
{
"columnId": 165,
"value": "Standard, SLA Level 2"
},
{
"columnId": 166,
"value": 80
},
{
"columnId": 167,
"value": "Likes treats"
}
]
}
Loading

0 comments on commit eae0c48

Please sign in to comment.