From 5a8e6592dd5e2e8410c4e5e949f66b8e3890bf99 Mon Sep 17 00:00:00 2001 From: Pascal Wilbrink Date: Thu, 14 Jul 2022 16:20:55 +0200 Subject: [PATCH 1/4] fix: Adding Subnetwork to a configuration without a Communication Element failed for the first time When creating a `Communication` Element in Communication.ts, the created Element is also returned to use it as a parent for the wizard The `Should create a Communication Element` integration test is extended to also check that the Wizard is closed properly Signed-off-by: Pascal Wilbrink --- src/editors/Communication.ts | 15 ++++++++--- .../communication/Communication.test.ts | 25 +++++++++++++++++++ 2 files changed, 36 insertions(+), 4 deletions(-) diff --git a/src/editors/Communication.ts b/src/editors/Communication.ts index 7b699c10c2..c05f8572b4 100644 --- a/src/editors/Communication.ts +++ b/src/editors/Communication.ts @@ -18,21 +18,28 @@ export default class CommunicationPlugin extends LitElement { @property() doc!: XMLDocument; - private createCommunication(): void { + /** + * Creates the Communication Element and returns the created Element + * @returns {Element} Communication `Element` + */ + private createCommunication(): Element { + const element: Element = createElement(this.doc, 'Communication', {}); this.dispatchEvent( newActionEvent({ new: { parent: this.doc.documentElement, - element: createElement(this.doc, 'Communication', {}), + element: element, }, }) ); + return element; } /** Opens a [[`WizardDialog`]] for creating a new `SubNetwork` element. */ private openCreateSubNetworkWizard(): void { - const parent = this.doc.querySelector(':root > Communication'); - if (!parent) this.createCommunication(); + const parent = + this.doc.querySelector(':root > Communication') || + this.createCommunication(); this.dispatchEvent(newWizardEvent(createSubNetworkWizard(parent!))); } diff --git a/test/integration/editors/communication/Communication.test.ts b/test/integration/editors/communication/Communication.test.ts index 1c57658d85..a2389091f0 100644 --- a/test/integration/editors/communication/Communication.test.ts +++ b/test/integration/editors/communication/Communication.test.ts @@ -6,6 +6,8 @@ import { MockWizard } from '../../../mock-wizard.js'; import Communication from '../../../../src/editors/Communication.js'; import { Editing } from '../../../../src/Editing.js'; import { Wizarding } from '../../../../src/Wizarding.js'; +import { Dialog } from '@material/mwc-dialog'; +import { WizardTextField } from '../../../../src/wizard-textfield.js'; describe('Communication Plugin', () => { customElements.define( @@ -73,5 +75,28 @@ describe('Communication Plugin', () => { await parent.updateComplete; expect(parent.wizardUI.dialogs.length).to.equal(1); }); + + it('Should create a Communication Element', async () => { + expect(parent.wizardUI.dialogs.length).to.equal(0); + fab.click(); + await parent.updateComplete; + expect(parent.wizardUI.dialogs.length).to.equal(1); + + const dialog: Dialog = parent.wizardUI.dialogs.item(0); + + const nameInput: WizardTextField = dialog.querySelector('wizard-textfield[label="name"]')!; + + nameInput.value = 'Test'; + + const saveButton: HTMLElement = dialog.querySelector('mwc-button[slot="primaryAction"]')!; + + await parent.updateComplete; + + saveButton.click(); + + await parent.updateComplete; + + expect(parent.wizardUI.dialogs.length).to.equal(0); + }); }); }); From 617e72d210869450611f5c8c75a41dbc2b6be9d1 Mon Sep 17 00:00:00 2001 From: Pascal Wilbrink Date: Mon, 18 Jul 2022 09:24:13 +0200 Subject: [PATCH 2/4] fix: Adding Subnetwork to a configuration without a Communication Element failed for the first time When creating a `Communication` Element in Communication.ts, the created Element is also returned to use it as a parent for the wizard The `Should create a Communication Element` integration test is extended to also check that the Wizard is closed properly Signed-off-by: Pascal Wilbrink --- src/editors/Communication.ts | 3 +- .../communication/Communication.test.ts | 50 +++++++++++-------- .../__snapshots__/Communication.test.snap.js | 2 - 3 files changed, 29 insertions(+), 26 deletions(-) diff --git a/src/editors/Communication.ts b/src/editors/Communication.ts index c05f8572b4..e7bb1f0207 100644 --- a/src/editors/Communication.ts +++ b/src/editors/Communication.ts @@ -37,8 +37,7 @@ export default class CommunicationPlugin extends LitElement { /** Opens a [[`WizardDialog`]] for creating a new `SubNetwork` element. */ private openCreateSubNetworkWizard(): void { - const parent = - this.doc.querySelector(':root > Communication') || + const parent =this.doc.querySelector(':root > Communication') || this.createCommunication(); this.dispatchEvent(newWizardEvent(createSubNetworkWizard(parent!))); diff --git a/test/integration/editors/communication/Communication.test.ts b/test/integration/editors/communication/Communication.test.ts index a2389091f0..19055b0c79 100644 --- a/test/integration/editors/communication/Communication.test.ts +++ b/test/integration/editors/communication/Communication.test.ts @@ -1,18 +1,16 @@ import { html, fixture, expect } from '@open-wc/testing'; -import '../../../mock-wizard.js'; -import { MockWizard } from '../../../mock-wizard.js'; +import '../../../mock-wizard-editor.js'; +import { MockWizardEditor } from '../../../mock-wizard-editor.js'; -import Communication from '../../../../src/editors/Communication.js'; -import { Editing } from '../../../../src/Editing.js'; -import { Wizarding } from '../../../../src/Wizarding.js'; +import Communication from '../../../../src/editors/Communication.js'; import { Dialog } from '@material/mwc-dialog'; import { WizardTextField } from '../../../../src/wizard-textfield.js'; describe('Communication Plugin', () => { customElements.define( 'communication-plugin', - Wizarding(Editing(Communication)) + Communication ); let element: Communication; beforeEach(async () => { @@ -45,18 +43,23 @@ describe('Communication Plugin', () => { describe('with a doc loaded missing a communication section', () => { let doc: XMLDocument; - let parent: MockWizard; + let parent: MockWizardEditor; let fab: HTMLElement; + let element: Communication; beforeEach(async () => { doc = await fetch('/test/testfiles/missingCommunication.scd') .then(response => response.text()) .then(str => new DOMParser().parseFromString(str, 'application/xml')); - parent = ( + + element = await fixture( + html`` + ); + + parent = ( await fixture( - html`` + html`${element}/mock-wizard-editor>` ) ); await element.updateComplete; @@ -78,25 +81,28 @@ describe('Communication Plugin', () => { it('Should create a Communication Element', async () => { expect(parent.wizardUI.dialogs.length).to.equal(0); - fab.click(); + expect(element.doc.querySelector('Communication')).is.null; + + await fab.click(); + await new Promise(resolve => setTimeout(resolve, 100)); // await animation await parent.updateComplete; - expect(parent.wizardUI.dialogs.length).to.equal(1); - const dialog: Dialog = parent.wizardUI.dialogs.item(0); + expect(parent.wizardUI.dialogs.length).to.equal(1); + + const dialog: Dialog = parent.wizardUI.dialog!; + expect(dialog).to.not.be.undefined; const nameInput: WizardTextField = dialog.querySelector('wizard-textfield[label="name"]')!; - nameInput.value = 'Test'; + await new Promise(resolve => setTimeout(resolve, 100)); // await animation const saveButton: HTMLElement = dialog.querySelector('mwc-button[slot="primaryAction"]')!; + await saveButton.click(); + await new Promise(resolve => setTimeout(resolve, 100)); // await animation - await parent.updateComplete; - - saveButton.click(); - - await parent.updateComplete; - - expect(parent.wizardUI.dialogs.length).to.equal(0); + expect(parent.wizardUI.dialog).not.to.exist; + expect(element.doc.querySelector('Communication')).not.is.null; + expect(element.doc.querySelector('Communication > SubNetwork[name="Test"]')).to.exist; }); }); }); diff --git a/test/integration/editors/communication/__snapshots__/Communication.test.snap.js b/test/integration/editors/communication/__snapshots__/Communication.test.snap.js index 248c0434e2..f748c6ad15 100644 --- a/test/integration/editors/communication/__snapshots__/Communication.test.snap.js +++ b/test/integration/editors/communication/__snapshots__/Communication.test.snap.js @@ -13,8 +13,6 @@ snapshots["Communication Plugin without a doc loaded looks like the latest snaps > - - `; /* end snapshot Communication Plugin without a doc loaded looks like the latest snapshot */ From 4af30c29765a3658b25d639bac6133ca1fd8595a Mon Sep 17 00:00:00 2001 From: Pascal Wilbrink Date: Mon, 18 Jul 2022 09:25:35 +0200 Subject: [PATCH 3/4] fix: Adding Subnetwork to a configuration without a Communication Element failed for the first time When creating a `Communication` Element in Communication.ts, the created Element is also returned to use it as a parent for the wizard The `Should create a Communication Element` integration test is extended to also check that the Wizard is closed properly Signed-off-by: Pascal Wilbrink --- test/integration/editors/communication/Communication.test.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/test/integration/editors/communication/Communication.test.ts b/test/integration/editors/communication/Communication.test.ts index 19055b0c79..d2bc85a475 100644 --- a/test/integration/editors/communication/Communication.test.ts +++ b/test/integration/editors/communication/Communication.test.ts @@ -86,8 +86,6 @@ describe('Communication Plugin', () => { await fab.click(); await new Promise(resolve => setTimeout(resolve, 100)); // await animation await parent.updateComplete; - - expect(parent.wizardUI.dialogs.length).to.equal(1); const dialog: Dialog = parent.wizardUI.dialog!; expect(dialog).to.not.be.undefined; From c1d2086ec5b12edef0b3c16e3e1855cf40fbf7b3 Mon Sep 17 00:00:00 2001 From: Pascal Wilbrink Date: Mon, 18 Jul 2022 09:26:00 +0200 Subject: [PATCH 4/4] fix: Adding Subnetwork to a configuration without a Communication Element failed for the first time When creating a `Communication` Element in Communication.ts, the created Element is also returned to use it as a parent for the wizard The `Should create a Communication Element` integration test is extended to also check that the Wizard is closed properly Signed-off-by: Pascal Wilbrink --- test/integration/editors/communication/Communication.test.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/test/integration/editors/communication/Communication.test.ts b/test/integration/editors/communication/Communication.test.ts index d2bc85a475..f3288693fb 100644 --- a/test/integration/editors/communication/Communication.test.ts +++ b/test/integration/editors/communication/Communication.test.ts @@ -98,7 +98,6 @@ describe('Communication Plugin', () => { await saveButton.click(); await new Promise(resolve => setTimeout(resolve, 100)); // await animation - expect(parent.wizardUI.dialog).not.to.exist; expect(element.doc.querySelector('Communication')).not.is.null; expect(element.doc.querySelector('Communication > SubNetwork[name="Test"]')).to.exist; });