Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(editors/template): make sure that edit wizards are always opened #845

Merged
merged 1 commit into from
Jul 5, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions src/editors/Templates.ts
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ const nsd7420 = fetch('public/xml/IEC_61850-7-420_2019A4.nsd')
/** An editor [[`plugin`]] for editing the `DataTypeTemplates` section. */
export default class TemplatesPlugin extends LitElement {
/** The document being edited as provided to plugins by [[`OpenSCD`]]. */
@property()
@property({ attribute: false })
doc!: XMLDocument;

async openCreateLNodeTypeWizard(): Promise<void> {
Expand Down Expand Up @@ -181,7 +181,7 @@ export default class TemplatesPlugin extends LitElement {
</h1>
<filtered-list
id="lnodetypelist"
@selected=${(e: SingleSelectedEvent) =>
@action=${(e: SingleSelectedEvent) =>
this.openLNodeTypeWizard(
(<ListItem>(<List>e.target).selected).value
)}
Expand Down Expand Up @@ -221,7 +221,7 @@ export default class TemplatesPlugin extends LitElement {
</h1>
<filtered-list
id="dotypelist"
@selected=${(e: SingleSelectedEvent) =>
@action=${(e: SingleSelectedEvent) =>
this.openDOTypeWizard(
(<ListItem>(<List>e.target).selected).value
)}
Expand Down Expand Up @@ -260,7 +260,7 @@ export default class TemplatesPlugin extends LitElement {
</h1>
<filtered-list
id="datypelist"
@selected=${(e: SingleSelectedEvent) =>
@action=${(e: SingleSelectedEvent) =>
this.openDATypeWizard(
(<ListItem>(<List>e.target).selected).value
)}
Expand Down Expand Up @@ -296,7 +296,7 @@ export default class TemplatesPlugin extends LitElement {
</h1>
<filtered-list
id="enumtypelist"
@selected=${(e: SingleSelectedEvent) =>
@action=${(e: SingleSelectedEvent) =>
this.openEnumTypeWizard(
(<ListItem>(<List>e.target).selected).value
)}
Expand Down
161 changes: 158 additions & 3 deletions test/integration/editors/templates/Templates.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,30 @@ import { html, fixture, expect } from '@open-wc/testing';
import '../../../mock-wizard-editor.js';
import { MockWizardEditor } from '../../../mock-wizard-editor.js';

import TemplatesPlugin from '../../../../src/editors/Templates.js';
import { Editing, EditingElement } from '../../../../src/Editing.js';
import { Wizarding, WizardingElement } from '../../../../src/Wizarding.js';
import TemplatesPlugin from '../../../../src/editors/Templates.js';
import { newWizardEvent } from '../../../../src/foundation.js';

describe('Templates Plugin', () => {
customElements.define(
'templates-plugin',
Wizarding(Editing(TemplatesPlugin))
);

let element: TemplatesPlugin;
let parent: MockWizardEditor;

beforeEach(async () => {
element = await fixture(html`<templates-plugin></templates-plugin>`);
parent = <MockWizardEditor>(
await fixture(
html`<mock-wizard-editor
><templates-plugin></templates-plugin
></mock-wizard-editor>`
)
);

element = parent.querySelector<TemplatesPlugin>('templates-plugin')!;
});

describe('without a doc loaded', () => {
Expand All @@ -29,12 +41,150 @@ describe('Templates Plugin', () => {
doc = await fetch('/test/testfiles/templates/datypes.scd')
.then(response => response.text())
.then(str => new DOMParser().parseFromString(str, 'application/xml'));

element.doc = doc;
await element.updateComplete;
await element.requestUpdate();
});

it('looks like the latest snapshot', async () => {
await expect(element).shadowDom.to.equalSnapshot();
});

describe('having a LNodeType element list that', () => {
beforeEach(async () => {
parent.workflow.length = 0;
(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[0]
.querySelector('mwc-list-item')
)).click();

await parent.requestUpdate();
});

it('opens a LNodeType edit wizard on list element click', () =>
expect(
parent.wizardUI.dialog?.querySelector(
'wizard-textfield[label="lnClass"]'
)
).to.exist);

it('allows to reopen the LNodeType edit wizard for the same element', async () => {
parent.dispatchEvent(newWizardEvent());

await parent.requestUpdate();

(<HTMLElement>(
element?.shadowRoot?.querySelector(
'filtered-list:nth-of-type(1) > mwc-list-item'
)
)).click();
await parent.requestUpdate();

expect(
parent.wizardUI.dialog?.querySelector(
'wizard-textfield[label="lnClass"]'
)
).to.exist;
});
});

describe('having a DOType element list that', () => {
beforeEach(async () => {
parent.workflow.length = 0;
(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[1]
.querySelector('mwc-list-item')
)).click();

await parent.requestUpdate();
});

it('opens a DOType edit wizard on list element click', () =>
expect(
parent.wizardUI.dialog?.querySelector('wizard-textfield[label="CDC"]')
).to.exist);

it('allows to reopen the DOType edit wizard for the same element', async () => {
parent.dispatchEvent(newWizardEvent());

await parent.requestUpdate();

(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[1]
.querySelector('mwc-list-item')
)).click();
await parent.requestUpdate();

expect(
parent.wizardUI.dialog?.querySelector('wizard-textfield[label="CDC"]')
).to.exist;
});
});

describe('having a DAType element list that', () => {
beforeEach(async () => {
parent.workflow.length = 0;
(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[2]
.querySelector('mwc-list-item')
)).click();

await parent.requestUpdate();
});

it('opens a DAType edit wizard on list element click', () =>
expect(parent.wizardUI.dialog).to.exist);

it('allows to reopen the DAType edit wizard for the same element', async () => {
parent.dispatchEvent(newWizardEvent());

await parent.requestUpdate();

(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[3]
.querySelector('mwc-list-item')
)).click();
await parent.requestUpdate();

expect(parent.wizardUI.dialog).to.exist;
});
});

describe('having a EnumType element list that', () => {
beforeEach(async () => {
parent.workflow.length = 0;
(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[3]
.querySelector('mwc-list-item')
)).click();

await parent.requestUpdate();
});

it('opens a EnumType edit wizard on list element click', () =>
expect(parent.wizardUI.dialog).to.exist);

it('allows to reopen the EnumType edit wizard for the same element', async () => {
parent.dispatchEvent(newWizardEvent());

await parent.requestUpdate();

(<HTMLElement>(
element?.shadowRoot
?.querySelectorAll('filtered-list')[3]
.querySelector('mwc-list-item')
)).click();
await parent.requestUpdate();

expect(parent.wizardUI.dialog).to.exist;
});
});
});

describe('with a doc loaded missing a datatypetemplates section', () => {
Expand All @@ -55,9 +205,11 @@ describe('Templates Plugin', () => {
);
await element.updateComplete;
});

it('has a mwc-fab', () => {
expect(element.shadowRoot?.querySelector('mwc-fab')).to.exist;
});

it('adds a DataTypeTemplates on floating action button click', async () => {
expect(doc.querySelector('DataTypeTemplates')).to.not.exist;
(<HTMLElement>(
Expand All @@ -73,6 +225,7 @@ describe('Templates Plugin', () => {
).to.exist;
});
});

describe('with a doc loaded having a datatypetemplates section', () => {
let doc: XMLDocument;
let parent: WizardingElement & EditingElement;
Expand All @@ -90,6 +243,7 @@ describe('Templates Plugin', () => {
);
await element.updateComplete;
});

it('opens an add enumtype wizard', async () => {
expect(parent.wizardUI.dialogs.length).to.equal(0);
(<HTMLElement>(
Expand All @@ -103,6 +257,7 @@ describe('Templates Plugin', () => {
await new Promise(resolve => setTimeout(resolve, 100)); // await animation
expect(parent.wizardUI.dialogs.length).to.equal(1);
});

it('adding an EnumType with the enumtype wizard', async () => {
expect(doc.querySelectorAll('EnumType').length).to.equal(4);
(<HTMLElement>(
Expand Down