diff --git a/.eslintrc.js b/.eslintrc.js index 1bc4dc6df..e88a3f1fc 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -25,7 +25,8 @@ module.exports = { // unecessary rerenders does not - at present - apply 'react/no-array-index-key': 0, "jest/no-export": "off", - "jest/expect-expect": "off" + "jest/expect-expect": "off", + "jest/valid-expect-in-promise": "off" }, overrides: [{ env: {browser: true}, diff --git a/packages/tc-ui/src/pages/delete/__tests__/e2e-delete-record.cyp.js b/packages/tc-ui/src/pages/delete/__tests__/e2e-delete-record.cyp.js index 8bb293541..7e8969fe2 100644 --- a/packages/tc-ui/src/pages/delete/__tests__/e2e-delete-record.cyp.js +++ b/packages/tc-ui/src/pages/delete/__tests__/e2e-delete-record.cyp.js @@ -38,12 +38,14 @@ describe('End-to-end - delete record', () => { cy.get('[data-button-type="delete"]').click(); - cy.window() - .its('confirm') - .should('called', 1); - cy.window() - .its('confirm.args.0') - .should('deep.eq', [deleteConfirmText]); + cy.window().then(win => { + cy.wrap(win) + .its('confirm') + .should('called', 1); + cy.wrap(win) + .its('confirm.args.0') + .should('deep.eq', [deleteConfirmText]); + }); cy.get('#code').should('have.text', code); cy.get('#someString').should('have.text', someString); }); diff --git a/packages/tc-ui/src/pages/edit/__tests__/e2e-edit-record.cyp.js b/packages/tc-ui/src/pages/edit/__tests__/e2e-edit-record.cyp.js index efdc73877..c781616a4 100644 --- a/packages/tc-ui/src/pages/edit/__tests__/e2e-edit-record.cyp.js +++ b/packages/tc-ui/src/pages/edit/__tests__/e2e-edit-record.cyp.js @@ -2,7 +2,10 @@ const { code, anotherDocument, someString, + anotherString, someEnum, + someDate, + someDatetime, } = require('../../../test-helpers/mainTypeData.json'); const { populateMinimumViableFields, @@ -77,32 +80,89 @@ describe('End-to-end - edit record', () => { .should('have.attr', 'href', `/ChildType/${code}-second-child`); }); - it('can edit other non minimum viable fields of a record', () => { + it('can edit document type fields', () => { cy.url().should('contain', `/MainType/${code}`); cy.get('#code').should('have.text', code); cy.get('#someString').should('have.text', someString); visitEditPage(); cy.get('textarea[name=anotherDocument]').type(anotherDocument); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#anotherDocument').should('have.text', anotherDocument); + + visitEditPage(); + cy.get('textarea[name=anotherDocument]').type(` ${anotherString}`); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + cy.get('#anotherDocument').should( + 'have.text', + `${anotherDocument} ${anotherString}`, + ); + }); + + it('can edit boolean type fields', () => { + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + + visitEditPage(); cy.get('[type="radio"]') .first() .check({ force: true }); - cy.get('select[name=someEnum]').select(someEnum); - cy.get('#checkbox-someMultipleChoice-First').check({ force: true }); - cy.get('#checkbox-someMultipleChoice-Third').check({ force: true }); + save(); + cy.url().should('contain', `/MainType/${code}`); + cy.get('#someBoolean').should('have.text', 'Yes'); + + visitEditPage(); + cy.get('[type="radio"]') + .eq(1) + .check({ force: true }); save(); cy.url().should('contain', `/MainType/${code}`); cy.get('#code').should('have.text', code); cy.get('#someString').should('have.text', someString); - cy.get('#children>li') - .eq(0) - .should('have.text', `${code}-first-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-first-child`); - cy.get('#anotherDocument').should('have.text', anotherDocument); - cy.get('#someBoolean').should('have.text', 'Yes'); + cy.get('#someBoolean').should('have.text', 'No'); + }); + + it('can edit enum type fields', () => { + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + + visitEditPage(); + cy.get('select[name=someEnum]').select(someEnum); + save(); + + cy.url().should('contain', `/MainType/${code}`); cy.get('#someEnum').should('have.text', someEnum); + + visitEditPage(); + cy.get('select[name=someEnum]').select(`Third`); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + cy.get('#someEnum').should('have.text', 'Third'); + }); + + it('can edit multiple choice type fields', () => { + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + + visitEditPage(); + cy.get('#checkbox-someMultipleChoice-First').check({ force: true }); + cy.get('#checkbox-someMultipleChoice-Third').check({ force: true }); + save(); + + cy.url().should('contain', `/MainType/${code}`); cy.get('#someMultipleChoice span:first-child').should( 'have.text', 'First', @@ -116,12 +176,6 @@ describe('End-to-end - edit record', () => { .should('have.length', 2); visitEditPage(); - - cy.get('textarea[name=anotherDocument]').type(` - updated`); - cy.get('[type="radio"]') - .eq(1) - .check({ force: true }); - cy.get('select[name=someEnum]').select(`Third`); cy.get('#checkbox-someMultipleChoice-Third').uncheck({ force: true }); cy.get('#checkbox-someMultipleChoice-Second').check({ force: true }); save(); @@ -129,17 +183,6 @@ describe('End-to-end - edit record', () => { cy.url().should('contain', `/MainType/${code}`); cy.get('#code').should('have.text', code); cy.get('#someString').should('have.text', someString); - cy.get('#children>li') - .eq(0) - .should('have.text', `${code}-first-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-first-child`); - cy.get('#anotherDocument').should( - 'have.text', - `${anotherDocument} - updated`, - ); - cy.get('#someBoolean').should('have.text', 'No'); - cy.get('#someEnum').should('have.text', 'Third'); cy.get('#someMultipleChoice span:first-child').should( 'have.text', 'First', @@ -152,4 +195,84 @@ describe('End-to-end - edit record', () => { .children() .should('have.length', 2); }); + + it('can edit date type fields', () => { + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + + visitEditPage(); + cy.get('input[name=someDate]') + .click() + .then(input => { + input[0].dispatchEvent(new Event('input', { bubbles: true })); + input.val(someDate); + }) + .click(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + cy.get('#someDate').should('have.text', '15 January 2020'); + + visitEditPage(); + + cy.get('input[name=someDate]') + .click() + .then(input => { + input[0].dispatchEvent(new Event('input', { bubbles: true })); + input.val('2022-09-12'); + }) + .click(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + cy.get('#someDate').should('have.text', '12 September 2022'); + }); + + it('can edit date-time type fields', () => { + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + + visitEditPage(); + cy.get('input[name=someDatetime]') + .click() + .then(input => { + input[0].dispatchEvent(new Event('input', { bubbles: true })); + input.val(someDatetime); + }) + .click(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + cy.get('#someDatetime').should( + 'have.text', + '15 January 2020, 1:00:00 PM', + ); + + visitEditPage(); + + cy.get('input[name=someDatetime]') + .click() + .then(input => { + input[0].dispatchEvent(new Event('input', { bubbles: true })); + input.val('2022-11-12T19:00'); + }) + .click(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#code').should('have.text', code); + cy.get('#someString').should('have.text', someString); + cy.get('#someDatetime').should( + 'have.text', + '12 November 2022, 7:00:00 PM', + ); + }); }); diff --git a/packages/tc-ui/src/primitives/relationship/__tests__/e2e-create-relationships.cyp.js b/packages/tc-ui/src/primitives/relationship/__tests__/e2e-create-relationships.cyp.js index 1772ba62b..98702e08b 100644 --- a/packages/tc-ui/src/primitives/relationship/__tests__/e2e-create-relationships.cyp.js +++ b/packages/tc-ui/src/primitives/relationship/__tests__/e2e-create-relationships.cyp.js @@ -23,6 +23,118 @@ describe('End-to-end - relationship creation', () => { save(); }); + describe('one-to-one relationship', () => { + it('can select a selection for one-to-one relationship', () => { + visitMainTypePage(); + visitEditPage(); + + pickFavouriteChild(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#favouriteChild') + .should('have.text', `${code}-first-child`) + .should('have.attr', 'href', `/ChildType/${code}-first-child`); + }); + + it('can not select another selection for one-to-one relationship', async () => { + visitMainTypePage(); + visitEditPage(); + + pickFavouriteChild(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#favouriteChild') + .should('have.text', `${code}-first-child`) + .should('have.attr', 'href', `/ChildType/${code}-first-child`); + + cy.get('#favouriteChild-picker').should('be.disabled'); + }); + }); + + describe('one-to-many relationship', () => { + it('can create one-to-many relationship', () => { + visitMainTypePage(); + + visitEditPage(); + + // pick second child + pickChild(); + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#children>li') + .eq(0) + .should('have.text', `${code}-first-child`) + .find('a') + .should('have.attr', 'href', `/ChildType/${code}-first-child`); + + cy.get('#children>li') + .eq(1) + .should('have.text', `${code}-second-child`) + .find('a') + .should('have.attr', 'href', `/ChildType/${code}-second-child`); + }); + + it('can select a selection for one-to-many relationship', () => { + visitMainTypePage(); + + visitEditPage(); + + // pick second child + pickChild(); + + cy.get('#ul-children') + .children() + .then(children => { + cy.wrap(children).should('have.length', 2); + cy.wrap(children) + .eq(0) + .find('span') + .should('have.text', 'e2e-demo-first-child'); + cy.wrap(children) + .eq(1) + .find('span') + .should('have.text', 'e2e-demo-second-child'); + }); + + save(); + + cy.url().should('contain', `/MainType/${code}`); + cy.get('#children>li').then(children => { + cy.wrap(children) + .eq(0) + .should('have.text', `${code}-first-child`) + .find('a') + .should( + 'have.attr', + 'href', + `/ChildType/${code}-first-child`, + ); + cy.wrap(children) + .eq(1) + .should('have.text', `${code}-second-child`) + .find('a') + .should( + 'have.attr', + 'href', + `/ChildType/${code}-second-child`, + ); + }); + }); + + it('can select another selection for one-to-many relationship', () => { + visitMainTypePage(); + + visitEditPage(); + + // pick second child + pickChild(); + cy.get('#children-picker').should('not.be.disabled'); + }); + }); + it('can create main -> parent relationship', () => { visitMainTypePage(); visitEditPage(); @@ -37,67 +149,53 @@ describe('End-to-end - relationship creation', () => { .should('have.attr', 'href', `/ParentType/${code}-parent`); }); - it('can create 1-to-many relationship', () => { + it('fetches suggestions from the autocomplete api', async () => { + const selector = '[data-property-name="children"]'; visitMainTypePage(); - visitEditPage(); - // pick second child - pickChild(); - save(); + cy.get('#children-picker') + .type('e2e') + .get(`${selector} .react-autosuggest__suggestions-list`) + .children() + .should('have.length', 1) + .first() + .should('contain', 'e2e-demo-second-child'); - cy.url().should('contain', `/MainType/${code}`); - cy.get('#children>li') + cy.get('#ul-children>li') .eq(0) - .should('have.text', `${code}-first-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-first-child`); - - cy.get('#children>li') - .eq(1) - .should('have.text', `${code}-second-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-second-child`); + .find('button') + .should('have.text', 'Remove') + .click(); + + cy.get('#children-picker').clear(); + cy.get('#children-picker').type('e2e'); + + cy.get(`${selector} .react-autosuggest__suggestions-list`) + .children() + .should('have.length', 2); + cy.get(`${selector} li#react-autowhatever-1--item-0`).should( + 'contain', + 'e2e-demo-first-child', + ); + cy.get(`${selector} li#react-autowhatever-1--item-1`).should( + 'contain', + 'e2e-demo-second-child', + ); }); - it('can create 1-to-1 relationship', () => { + it('does not suggest previously selected records', async () => { + const selector = '[data-property-name="children"]'; visitMainTypePage(); visitEditPage(); - pickFavouriteChild(); - save(); - - cy.url().should('contain', `/MainType/${code}`); - cy.get('#favouriteChild') - .should('have.text', `${code}-first-child`) - .should('have.attr', 'href', `/ChildType/${code}-first-child`); - }); - - it('can create both 1-to-1 and 1-to-many relationships', () => { - visitMainTypePage(); - - visitEditPage(); - - // pick second child - pickChild(); - pickFavouriteChild(); - save(); - - cy.url().should('contain', `/MainType/${code}`); - cy.get('#children>li') - .eq(0) - .should('have.text', `${code}-first-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-first-child`); - - cy.get('#children>li') - .eq(1) - .should('have.text', `${code}-second-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-second-child`); - - cy.get('#favouriteChild') - .should('have.text', `${code}-first-child`) - .should('have.attr', 'href', `/ChildType/${code}-first-child`); + // e2e-demo-first-child is already selected + cy.get('#children-picker') + .type('e2e') + .get(`${selector} .react-autosuggest__suggestions-list`) + .children() + .should('have.length', 1) + .first() + .should('contain', 'e2e-demo-second-child'); }); }); diff --git a/packages/tc-ui/src/primitives/relationship/__tests__/e2e-delete-relationships.cyp.js b/packages/tc-ui/src/primitives/relationship/__tests__/e2e-delete-relationships.cyp.js index a248c8d51..ada80146f 100644 --- a/packages/tc-ui/src/primitives/relationship/__tests__/e2e-delete-relationships.cyp.js +++ b/packages/tc-ui/src/primitives/relationship/__tests__/e2e-delete-relationships.cyp.js @@ -137,17 +137,18 @@ describe('End-to-end - relationship deletion', () => { cy.get('#children') .children() .should('have.length', 2); - cy.get('#children>li') - .eq(0) - .should('have.text', `${code}-first-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-first-child`); - - cy.get('#children>li') - .eq(1) - .should('have.text', `${code}-second-child`) - .find('a') - .should('have.attr', 'href', `/ChildType/${code}-second-child`); + cy.get('#children>li').then(children => { + cy.wrap(children) + .eq(0) + .should('have.text', `${code}-first-child`) + .find('a') + .should('have.attr', 'href', `/ChildType/${code}-first-child`); + cy.wrap(children) + .eq(1) + .should('have.text', `${code}-second-child`) + .find('a') + .should('have.attr', 'href', `/ChildType/${code}-second-child`); + }); cy.get('#favouriteChild') .should('have.text', `${code}-first-child`) diff --git a/packages/tc-ui/src/primitives/relationship/__tests__/e2e-disply-rich-relationships.cyp.js b/packages/tc-ui/src/primitives/relationship/__tests__/e2e-disply-rich-relationships.cyp.js index d279ae1e3..b5ace6d76 100644 --- a/packages/tc-ui/src/primitives/relationship/__tests__/e2e-disply-rich-relationships.cyp.js +++ b/packages/tc-ui/src/primitives/relationship/__tests__/e2e-disply-rich-relationships.cyp.js @@ -27,7 +27,7 @@ describe('End-to-end - display relationship properties', () => { visitMainTypePage(); }); - it.only('can display/hide relationship properties', async () => { + it('can display/hide relationship properties', async () => { visitEditPage(); pickCuriousChild(); save(); @@ -93,7 +93,7 @@ describe('End-to-end - display relationship properties', () => { }); }); - it.only('can display properties on a 1-to-1 relationship', async () => { + it('can display properties on a 1-to-1 relationship', async () => { visitEditPage(); pickCuriousChild(); save(); diff --git a/packages/tc-ui/src/primitives/temporal/__tests__/e2e-record-temporal.cyp.js b/packages/tc-ui/src/primitives/temporal/__tests__/e2e-record-temporal.cyp.js index f2703b162..c86fb2299 100644 --- a/packages/tc-ui/src/primitives/temporal/__tests__/e2e-record-temporal.cyp.js +++ b/packages/tc-ui/src/primitives/temporal/__tests__/e2e-record-temporal.cyp.js @@ -1,4 +1,3 @@ -/* eslint-disable jest/valid-expect-in-promise */ const { code, someString,