@api-client/ui 0.0.17 → 0.1.0

package/test/elements/modeling/domain-entity-editor.spec.ts

@@ -1,1377 +0,0 @@
-import { fixture, assert, nextFrame, html } from '@open-wc/testing'
-import sinon from 'sinon'
-import {
-  DataDomain,
-  DomainEntity,
-  DomainModel,
-  DomainProperty,
-  DomainAssociation,
-  DomainEntityKind,
-} from '@api-client/core/browser.js'
-import { type EntitySelectDetail } from '../../../src/elements/modeling/types.js'
-import type DomainEntityEditor from '../../../src/elements/modeling/internals/DomainEntityEditor.js'
-import type { MdOutlinedTextField } from '@material/web/textfield/outlined-text-field.js'
-import type { MdTabs } from '@material/web/tabs/tabs.js'
-import type { MdOutlinedSelect as MdSelect } from '@material/web/select/outlined-select.js'
-import type { MdMenuItem } from '@material/web/menu/menu-item.js'
-import type { MdMenu } from '@material/web/menu/menu.js'
-import type { MdFilledTonalButton } from '@material/web/button/filled-tonal-button.js'
-import type { MdListItem } from '@material/web/list/list-item.js'
-import type { MdList } from '@material/web/list/list.js'
-import { Events } from '../../../src/events/Events.js'
-import type { BrowseDataDomainIntent } from '../../../src/apps/activities/BrowseDataDomainActivity.js'
-import { IntentResult } from '../../../src/core/ActivityManager.js'
-
-import '../../../src/elements/modeling/domain-entity-editor.js'
-
-describe('<domain-entity-editor>', () => {
-  async function basicFixture(root?: DataDomain, selected?: string): Promise<DomainEntityEditor> {
-    const element = await fixture(
-      html`<domain-entity-editor .root="${root}" .selected="${selected}"></domain-entity-editor>`
-    )
-    await nextFrame()
-    return element as DomainEntityEditor
-  }
-
-  async function previewFixture(root?: DataDomain, selected?: string): Promise<DomainEntityEditor> {
-    const element = await fixture(
-      html`<domain-entity-editor .root="${root}" .selected="${selected}" contentTab="preview"></domain-entity-editor>`
-    )
-    await nextFrame()
-    return element as DomainEntityEditor
-  }
-
-  describe('Initialization', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      const dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('sets the dataEntity', async () => {
-      const element = await basicFixture(root, selected)
-      assert.typeOf(element['domainElement'], 'object', 'dataEntity is set')
-      assert.deepEqual(element['domainElement']?.key, e1.key, 'dataEntity has the value')
-    })
-
-    it('does not set dataEntity when no root', async () => {
-      const element = await basicFixture(undefined, selected)
-      assert.isUndefined(element['domainElement'])
-    })
-
-    it('does not set dataEntity when no selected', async () => {
-      const element = await basicFixture(root, undefined)
-      assert.isUndefined(element['domainElement'])
-    })
-
-    it('does not set dataEntity when selected is invalid', async () => {
-      const element = await basicFixture(root, 'invalid-key')
-      assert.isUndefined(element['domainElement'])
-    })
-
-    it('sets contentTab to design', async () => {
-      const element = await basicFixture(root, selected)
-      assert.equal(element.contentTab, 'design')
-    })
-
-    it('sets mime to application/json', async () => {
-      const element = await basicFixture(root, selected)
-      assert.equal(element.mime, 'application/json')
-    })
-
-    it('sets mockValues to false', async () => {
-      const element = await basicFixture(root, selected)
-      assert.isFalse(element.mockValues)
-    })
-
-    it('sets schemaPreview to undefined', async () => {
-      const element = await basicFixture(root, selected)
-      assert.isUndefined(element.schemaPreview)
-    })
-  })
-
-  describe('handleMetaChange()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('updates the name', async () => {
-      const element = await basicFixture(root, selected)
-      const input = element.renderRoot.querySelector<MdOutlinedTextField>('md-outlined-text-field[name="name"]')
-      assert.ok(input)
-      input.value = 'new-name'
-      input.dispatchEvent(new Event('change'))
-      assert.equal(e1.info.name, 'new-name')
-    })
-
-    it('updates the display name', async () => {
-      const element = await basicFixture(root, selected)
-      const input = element.renderRoot.querySelector<MdOutlinedTextField>('md-outlined-text-field[name="displayName"]')
-      assert.ok(input)
-      input.value = 'new-display-name'
-      input.dispatchEvent(new Event('change'))
-      assert.equal(e1.info.displayName, 'new-display-name')
-    })
-
-    it('updates the description', async () => {
-      const element = await basicFixture(root, selected)
-      const input = element.renderRoot.querySelector<MdOutlinedTextField>('md-outlined-text-field[name="description"]')
-      assert.ok(input)
-      input.value = 'new-description'
-      input.dispatchEvent(new Event('change'))
-      assert.equal(e1.info.description, 'new-description')
-    })
-
-    it('does nothing when no dataEntity', async () => {
-      const element = await basicFixture(root, undefined)
-      const input = element.renderRoot.querySelector<MdOutlinedTextField>('md-outlined-text-field[name="name"]')
-      assert.notOk(input)
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const input = element.renderRoot.querySelector<MdOutlinedTextField>('md-outlined-text-field[name="name"]')
-      assert.ok(input)
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      input.value = 'new-name'
-      input.dispatchEvent(new Event('change'))
-      assert.isTrue(spy.calledOnce)
-    })
-  })
-
-  describe('handleContentTabChange()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('updates the contentTab', async () => {
-      const element = await basicFixture(root, selected)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.ok(tabs)
-      const tab = tabs.querySelector<HTMLElement>('[data-key="preview"]')
-      assert.ok(tab)
-      tab.click()
-      await element.updateComplete
-      assert.equal(element.contentTab, 'preview')
-    })
-
-    it('does nothing when no tabs', async () => {
-      const element = await basicFixture(root, undefined)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.notOk(tabs)
-    })
-
-    it('generates example when switching to preview', async () => {
-      const element = await basicFixture(root, selected)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.ok(tabs)
-      const tab = tabs.querySelector<HTMLElement>('[data-key="preview"]')
-      assert.ok(tab)
-      const spy = sinon.spy(element, 'generateExample')
-      tab.click()
-      await nextFrame()
-      assert.isTrue(spy.calledOnce)
-    })
-  })
-
-  describe('generateExample()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('sets the schemaPreview', async () => {
-      const element = await previewFixture(root, selected)
-      element.generateExample()
-      assert.typeOf(element.schemaPreview, 'string')
-    })
-
-    it('does nothing when no dataEntity', async () => {
-      const element = await previewFixture(root, undefined)
-      element.generateExample()
-      assert.isUndefined(element.schemaPreview)
-    })
-
-    it('does nothing when not in preview', async () => {
-      const element = await basicFixture(root, selected)
-      element.generateExample()
-      assert.isUndefined(element.schemaPreview)
-    })
-
-    it('generates mocked values when mockValues is true', async () => {
-      const element = await previewFixture(root, selected)
-      element.mockValues = true
-      element.generateExample()
-      assert.typeOf(element.schemaPreview, 'string')
-    })
-  })
-
-  describe('notifyChange()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      element.notifyChange()
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('generates example', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy(element, 'generateExample')
-      element.notifyChange()
-      assert.isTrue(spy.calledOnce)
-    })
-  })
-
-  describe('handleMimeChange()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('updates the mime', async () => {
-      const element = await previewFixture(root, selected)
-      const select = element.renderRoot.querySelector<MdSelect>('md-outlined-select[name="mime"]')
-      assert.ok(select, 'renders the mime selector')
-      select.value = 'application/xml'
-      await select.updateComplete
-      select.dispatchEvent(new Event('change'))
-      assert.equal(element.mime, 'application/xml')
-    })
-
-    it('does nothing when no select', async () => {
-      const element = await previewFixture(root, undefined)
-      const select = element.renderRoot.querySelector<MdSelect>('md-outlined-select[name="mime"]')
-      assert.notOk(select)
-    })
-  })
-
-  describe('handleFieldSelection()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-    let p1: DomainProperty
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      p1 = e1.addProperty({ type: 'string', key: 'p1', info: { name: 'p1' } })
-      selected = e1.key
-    })
-
-    it('selects a field', async () => {
-      const element = await basicFixture(root, selected)
-      const item = element.renderRoot.querySelector<HTMLElement>(`[data-key="${p1.key}"]`)
-      assert.ok(item)
-      const spy = sinon.spy()
-      element.addEventListener('select', spy)
-      item.click()
-      assert.isTrue(spy.calledOnce)
-      const detail = spy.args[0][0].detail as EntitySelectDetail
-      assert.deepEqual(detail, { key: p1.key, kind: p1.kind })
-    })
-
-    it('sets selectedProperty', async () => {
-      const element = await basicFixture(root, selected)
-      const item = element.renderRoot.querySelector<HTMLElement>(`[data-key="${p1.key}"]`)
-      assert.ok(item)
-      item.click()
-      assert.equal(element.selectedProperty, p1.key)
-    })
-
-    it('does nothing when no item', async () => {
-      const element = await basicFixture(root, undefined)
-      const item = element.renderRoot.querySelector<HTMLElement>(`[data-key="${p1.key}"]`)
-      assert.notOk(item)
-    })
-  })
-
-  describe('select()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('dispatches select event', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy()
-      element.addEventListener('select', spy)
-      element.select('p1', 'property')
-      assert.isTrue(spy.calledOnce)
-      const detail = spy.args[0][0].detail as EntitySelectDetail
-      assert.deepEqual(detail, { key: 'p1', kind: 'property' })
-    })
-
-    it('sets selectedProperty', async () => {
-      const element = await basicFixture(root, selected)
-      element.select('p1', 'property')
-      assert.equal(element.selectedProperty, 'p1')
-    })
-  })
-
-  describe('addProperty()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('adds a new property', async () => {
-      const element = await basicFixture(root, selected)
-      element.addProperty()
-      assert.equal([...e1.listProperties()].length, 1)
-    })
-
-    it('adds a new property with a name', async () => {
-      const element = await basicFixture(root, selected)
-      element.addProperty('test')
-      assert.equal([...e1.listProperties()].length, 1)
-      assert.equal([...e1.listProperties()][0].info.name, 'test')
-    })
-
-    it('selects the new property', async () => {
-      const element = await basicFixture(root, selected)
-      element.addProperty()
-      assert.equal(element.selectedProperty, [...e1.listProperties()][0].key)
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      element.addProperty()
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when no dataEntity', async () => {
-      const element = await basicFixture(root, undefined)
-      assert.doesNotThrow(() => element.addProperty())
-    })
-  })
-
-  describe('addAssociation()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('adds a new association', async () => {
-      const element = await basicFixture(root, selected)
-      element.addAssociation()
-      assert.equal([...e1.listAssociations()].length, 1)
-    })
-
-    it('adds a new association with a name', async () => {
-      const element = await basicFixture(root, selected)
-      element.addAssociation('test')
-      assert.equal([...e1.listAssociations()].length, 1)
-      assert.equal([...e1.listAssociations()][0].info.name, 'test')
-    })
-
-    it('selects the new association', async () => {
-      const element = await basicFixture(root, selected)
-      element.addAssociation()
-      assert.equal(element.selectedProperty, [...e1.listAssociations()][0].key)
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      element.addAssociation()
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when no dataEntity', async () => {
-      const element = await basicFixture(root, undefined)
-      assert.doesNotThrow(() => element.addAssociation())
-    })
-  })
-
-  describe('handleAddMenuClose()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('adds a property', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = menu.querySelector('[data-action="property"]') as MdMenuItem
-      assert.ok(item)
-      const spy = sinon.spy(element, 'addProperty')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'click' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('adds an association', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = menu.querySelector('[data-action="association"]') as MdMenuItem
-      assert.ok(item)
-      const spy = sinon.spy(element, 'addAssociation')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'click' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when escape', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = menu.querySelector('[data-action="association"]') as MdMenuItem
-      assert.ok(item)
-      const spy = sinon.spy(element, 'addAssociation')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'keydown', key: 'Escape' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isFalse(spy.called)
-    })
-  })
-
-  describe('renderParentEntity()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let e2: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      e2 = dm1.addEntity({ key: 'e2', info: { name: 'e2' } })
-      e1.addParent(e2.key)
-      selected = e1.key
-    })
-
-    it('renders the parent entity chip', async () => {
-      const element = await basicFixture(root, selected)
-      const parent = element.renderRoot.querySelector('.inheritance-section .parent-chip')
-      assert.ok(parent)
-      assert.equal(parent.textContent?.trim(), e2.info.renderLabel)
-    })
-
-    it('renders the "Choose parent entity" button when no parents', async () => {
-      const element = await basicFixture(root, e2.key)
-      const button = element.renderRoot.querySelector<MdFilledTonalButton>(
-        '.inheritance-section ui-filled-tonal-button.select'
-      )
-      assert.ok(button)
-      assert.equal(button.textContent?.trim(), 'Choose parent entity')
-    })
-
-    it('renders the "Choose parent entity" button when parents', async () => {
-      const element = await basicFixture(root, selected)
-      const button = element.renderRoot.querySelector<MdFilledTonalButton>(
-        '.inheritance-section ui-filled-tonal-button.select'
-      )
-      assert.ok(button)
-      assert.equal(button.textContent?.trim(), 'Choose parent entity')
-    })
-  })
-
-  describe('renderFieldsEmptyState()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('renders the empty state UI', async () => {
-      const element = await basicFixture(root, selected)
-      const empty = element.renderRoot.querySelector('.empty-fields')
-      assert.ok(empty)
-      const icon = empty.querySelector('ui-icon')
-      assert.ok(icon)
-      assert.equal(icon.getAttribute('icon'), 'textFields')
-      const message = empty.querySelector('.empty-message')
-      assert.ok(message)
-      assert.equal(message.textContent?.trim(), 'Find your data entities here')
-    })
-  })
-
-  describe('renderFieldsList()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let p1: DomainProperty
-    let a1: DomainAssociation
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      p1 = e1.addProperty({ type: 'string', key: 'p1', info: { name: 'p1' } })
-      a1 = e1.addAssociation({}, { key: 'a1', info: { name: 'a1' } })
-      selected = e1.key
-    })
-
-    it('renders the list of fields', async () => {
-      const element = await basicFixture(root, selected)
-      const list = element.renderRoot.querySelector<MdList>('.fields-list')
-      assert.ok(list)
-      const items = list.querySelectorAll<MdListItem>('md-list-item')
-      assert.equal(items.length, 2)
-    })
-
-    it('renders the fields in the correct order', async () => {
-      const element = await basicFixture(root, selected)
-      const list = element.renderRoot.querySelector<MdList>('.fields-list')
-      assert.ok(list)
-      const items = list.querySelectorAll<MdListItem>('md-list-item')
-      assert.equal(items[0].dataset.key, p1.key)
-      assert.equal(items[1].dataset.key, a1.key)
-    })
-  })
-
-  describe('renderField()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let p1: DomainProperty
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      p1 = e1.addProperty({ type: 'string', key: 'p1', info: { name: 'p1' } })
-      selected = e1.key
-    })
-
-    it('renders the field item', async () => {
-      const element = await basicFixture(root, selected)
-      const item = element.renderRoot.querySelector<MdListItem>('md-list-item')
-      assert.ok(item)
-      assert.equal(item.dataset.key, p1.key)
-      assert.equal(item.dataset.kind, p1.kind)
-      const icon = item.querySelector('ui-icon')
-      assert.ok(icon)
-      assert.equal(icon.getAttribute('icon'), 'textFields')
-      const label = item.querySelector('[slot="headline"]')
-      assert.ok(label)
-      assert.equal(label.textContent?.trim(), p1.info.renderLabel)
-      const supporting = item.querySelector('[slot="trailing-supporting-text"]')
-      assert.ok(supporting)
-      assert.equal(supporting.textContent?.trim(), 'String')
-    })
-
-    it('renders the selected class', async () => {
-      const element = await basicFixture(root, selected)
-      element.selectedProperty = p1.key
-      await element.updateComplete
-      const item = element.renderRoot.querySelector<MdListItem>('md-list-item')
-      assert.ok(item)
-      assert.isTrue(item.classList.contains('selected'))
-    })
-
-    it('dispatches the select event', async () => {
-      const element = await basicFixture(root, selected)
-      const item = element.renderRoot.querySelector<MdListItem>('md-list-item')
-      assert.ok(item)
-      const spy = sinon.spy()
-      element.addEventListener('select', spy)
-      item.click()
-      assert.isTrue(spy.calledOnce)
-      const detail = spy.args[0][0].detail as EntitySelectDetail
-      assert.deepEqual(detail, { key: p1.key, kind: p1.kind })
-    })
-  })
-
-  describe('renderFieldAddButton()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('renders the add field button', async () => {
-      const element = await basicFixture(root, selected)
-      const button = element.renderRoot.querySelector<MdFilledTonalButton>('.field-add-button ui-filled-tonal-button')
-      assert.ok(button)
-      button.querySelector('md-icon')?.remove()
-      assert.equal(button.textContent?.trim(), 'Add field')
-    })
-
-    it('opens the menu when the button is clicked', async () => {
-      const element = await basicFixture(root, selected)
-      const button = element.renderRoot.querySelector<MdFilledTonalButton>('.field-add-button ui-filled-tonal-button')
-      assert.ok(button)
-      const menu = element.renderRoot.querySelector('md-menu')
-      assert.ok(menu)
-      const spy = sinon.spy(menu, 'show')
-      button.click()
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('renders the menu items', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('.field-add-button md-menu')
-      assert.ok(menu)
-      const items = menu.querySelectorAll('md-menu-item')
-      assert.equal(items.length, 2)
-      assert.equal(items[0].querySelector('[slot="headline"]')?.textContent?.trim(), 'Property')
-      assert.equal(
-        items[0].querySelector('[slot="supporting-text"]')?.textContent?.trim(),
-        'Data property in the schema'
-      )
-      assert.equal(items[1].querySelector('[slot="headline"]')?.textContent?.trim(), 'Reference')
-      assert.equal(
-        items[1].querySelector('[slot="supporting-text"]')?.textContent?.trim(),
-        'Connect to another entity object'
-      )
-    })
-  })
-
-  describe('renderPreviewMimeSelector()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('renders the mime selector', async () => {
-      const element = await basicFixture(root, selected)
-      element.contentTab = 'preview'
-      await element.updateComplete
-      const select = element.renderRoot.querySelector<MdSelect>('md-outlined-select[name="mime"]')
-      assert.ok(select)
-      const options = select.querySelectorAll('md-select-option')
-      assert.equal(options.length, 2)
-      assert.equal(options[0].textContent?.trim(), 'application/json')
-      assert.equal(options[1].textContent?.trim(), 'application/xml')
-    })
-
-    it('updates the mime property', async () => {
-      const element = await basicFixture(root, selected)
-      element.contentTab = 'preview'
-      await element.updateComplete
-      const select = element.renderRoot.querySelector<MdSelect>('md-outlined-select[name="mime"]')
-      assert.ok(select)
-      select.value = 'application/xml'
-      await select.updateComplete
-      select.dispatchEvent(new Event('change'))
-      assert.equal(element.mime, 'application/xml')
-    })
-  })
-
-  describe('handleContentTabChange()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('updates the contentTab', async () => {
-      const element = await basicFixture(root, selected)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.ok(tabs)
-      const tab = tabs.querySelector<HTMLElement>('[data-key="preview"]')
-      assert.ok(tab)
-      tab.click()
-      await element.updateComplete
-      assert.equal(element.contentTab, 'preview')
-    })
-
-    it('does nothing when no tabs', async () => {
-      const element = await basicFixture(root, undefined)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.notOk(tabs)
-    })
-
-    it('generates example when switching to preview', async () => {
-      const element = await basicFixture(root, selected)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.ok(tabs)
-      const tab = tabs.querySelector<HTMLElement>('[data-key="preview"]')
-      assert.ok(tab)
-      const spy = sinon.spy(element, 'generateExample')
-      tab.click()
-      await nextFrame()
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when no tab is selected', async () => {
-      const element = await basicFixture(root, selected)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.ok(tabs)
-      const spy = sinon.spy(element, 'generateExample')
-      tabs.dispatchEvent(new Event('change'))
-      await nextFrame()
-      assert.isFalse(spy.called)
-    })
-
-    it('does nothing when an invalid tab is selected', async () => {
-      const element = await basicFixture(root, selected)
-      const tabs = element.renderRoot.querySelector<MdTabs>('md-tabs')
-      assert.ok(tabs)
-      const spy = sinon.spy(element, 'generateExample')
-      const tab = document.createElement('md-secondary-tab')
-      tab.dataset.key = 'invalid'
-      tabs.append(tab)
-      tabs.dispatchEvent(new Event('change'))
-      await nextFrame()
-      assert.isFalse(spy.called)
-    })
-  })
-
-  describe('handleAddMenuClose()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('adds a property', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = menu.querySelector('[data-action="property"]') as MdMenuItem
-      assert.ok(item)
-      const spy = sinon.spy(element, 'addProperty')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'click' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('adds an association', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = menu.querySelector('[data-action="association"]') as MdMenuItem
-      assert.ok(item)
-      const spy = sinon.spy(element, 'addAssociation')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'click' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when escape', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = menu.querySelector('[data-action="association"]') as MdMenuItem
-      assert.ok(item)
-      const spy = sinon.spy(element, 'addAssociation')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'keydown', key: 'Escape' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isFalse(spy.called)
-    })
-
-    it('does nothing when no action is defined', async () => {
-      const element = await basicFixture(root, selected)
-      const menu = element.renderRoot.querySelector<MdMenu>('md-menu')
-      assert.ok(menu)
-      const item = document.createElement('md-menu-item')
-      const spy = sinon.spy(element, 'addAssociation')
-      menu.dispatchEvent(
-        new CustomEvent('close-menu', {
-          detail: {
-            initiator: item,
-            reason: { kind: 'click' },
-            itemPath: [item],
-          },
-        })
-      )
-      assert.isFalse(spy.called)
-    })
-  })
-
-  describe('computeEntity()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('does nothing when no root', async () => {
-      const element = await basicFixture(undefined, selected)
-      // @ts-expect-error protected method
-      element.computeEntity()
-      assert.isUndefined(element['domainElement'])
-    })
-
-    it('does nothing when no root', async () => {
-      const element = await basicFixture(root, selected)
-      // @ts-expect-error protected method
-      element.computeEntity()
-      assert.ok(element['domainElement'])
-    })
-  })
-
-  describe('handleChooseParent()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('starts the activity', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy(Events.Intent, 'startActivityForResult')
-      element.handleChooseParent()
-      assert.isTrue(spy.calledOnce)
-      const [arg] = spy.args[0]
-      assert.equal(arg.action, 'data-domain/browse')
-      const intent = arg.data as BrowseDataDomainIntent
-      assert.equal(intent.reason, 'pick')
-      assert.equal(intent.namespaceKey, root.key)
-      assert.deepEqual(intent.allowed, ['entity'])
-      assert.isFalse(intent.withExternal)
-      assert.isTrue(intent.withRecent)
-    })
-  })
-
-  describe('handleDeleteParent()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let e2: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      e2 = dm1.addEntity({ key: 'e2', info: { name: 'e2' } })
-      e1.addParent(e2.key)
-      selected = e1.key
-    })
-
-    it('removes the parent', async () => {
-      const element = await basicFixture(root, selected)
-      const chip = element.renderRoot.querySelector('.parent-chip') as HTMLElement
-      assert.ok(chip)
-      chip.dispatchEvent(new Event('remove'))
-      assert.equal([...e1.listParents()].length, 0)
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const chip = element.renderRoot.querySelector('.parent-chip') as HTMLElement
-      assert.ok(chip)
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      chip.dispatchEvent(new Event('remove'))
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when no dataEntity', async () => {
-      const element = await basicFixture(root, undefined)
-      assert.doesNotThrow(() => element.handleDeleteParent(new Event('click')))
-    })
-  })
-
-  describe('handleNavigateParent()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let e2: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      e2 = dm1.addEntity({ key: 'e2', info: { name: 'e2' } })
-      e1.addParent(e2.key)
-      selected = e1.key
-    })
-
-    it('dispatches openentity event', async () => {
-      const element = await basicFixture(root, selected)
-      const chip = element.renderRoot.querySelector('.parent-chip') as HTMLElement
-      assert.ok(chip)
-      const spy = sinon.spy()
-      element.addEventListener('openentity', spy)
-      chip.click()
-      assert.isTrue(spy.calledOnce)
-      const detail = spy.args[0][0].detail as EntitySelectDetail
-      assert.deepEqual(detail, { key: e2.key, kind: DomainEntityKind })
-    })
-
-    it('does nothing when no key', async () => {
-      const element = await basicFixture(root, selected)
-      const chip = element.renderRoot.querySelector('.parent-chip') as HTMLElement
-      assert.ok(chip)
-      chip.dataset.key = undefined
-      assert.doesNotThrow(() => chip.click())
-    })
-  })
-
-  describe('handleSelectTargetEntity()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let e2: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      e2 = dm1.addEntity({ key: 'e2', info: { name: 'e2' } })
-      selected = e1.key
-    })
-
-    it('adds a parent', async () => {
-      const element = await basicFixture(root, selected)
-      // @ts-expect-error protected method
-      element.handleSelectTargetEntity(IntentResult.RESULT_OK, {
-        action: 'data-domain/browse',
-        data: {
-          result: 'ok',
-          kind: DomainEntityKind,
-          selected: e2.key,
-          namespace: root.key,
-        },
-      })
-      assert.equal([...e1.listParents()].length, 1)
-      assert.equal([...e1.listParents()][0].key, e2.key)
-    })
-
-    it('does nothing when canceled', async () => {
-      const element = await basicFixture(root, selected)
-      // @ts-expect-error protected method
-      element.handleSelectTargetEntity(IntentResult.RESULT_CANCELED, {
-        action: 'data-domain/browse',
-        data: {
-          result: 'ok',
-          kind: DomainEntityKind,
-          selected: e2.key,
-          namespace: root.key,
-        },
-      })
-      assert.equal([...e1.listParents()].length, 0)
-    })
-
-    it('does nothing when result is not ok', async () => {
-      const element = await basicFixture(root, selected)
-      // @ts-expect-error protected method
-      element.handleSelectTargetEntity(IntentResult.RESULT_OK, {
-        action: 'data-domain/browse',
-        data: {
-          result: 'error',
-          kind: DomainEntityKind,
-          selected: e2.key,
-          namespace: root.key,
-        },
-      })
-      assert.equal([...e1.listParents()].length, 0)
-    })
-
-    it('does nothing when no data', async () => {
-      const element = await basicFixture(root, selected)
-      // @ts-expect-error protected method
-      element.handleSelectTargetEntity(IntentResult.RESULT_OK, {
-        action: 'data-domain/browse',
-        data: {},
-      })
-      assert.equal([...e1.listParents()].length, 0)
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      // @ts-expect-error protected method
-      element.handleSelectTargetEntity(IntentResult.RESULT_OK, {
-        action: 'data-domain/browse',
-        data: {
-          result: 'ok',
-          kind: DomainEntityKind,
-          selected: e2.key,
-          namespace: root.key,
-        },
-      })
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when no dataEntity', async () => {
-      const element = await basicFixture(root, undefined)
-      assert.doesNotThrow(() => {
-        // @ts-expect-error protected method
-        element.handleSelectTargetEntity(IntentResult.RESULT_OK, {
-          action: 'data-domain/browse',
-          data: {
-            result: 'ok',
-            kind: DomainEntityKind,
-            selected: e2.key,
-            namespace: root.key,
-          },
-        })
-      })
-    })
-  })
-
-  describe('handleInheritanceDragEnter()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('adds drop-zone class', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const dt = new DataTransfer()
-      dt.setData('text/kind', DomainEntityKind)
-      dt.setData(DomainEntityKind, '')
-      const e = new DragEvent('dragenter', { dataTransfer: dt })
-      zone.dispatchEvent(e)
-      assert.isTrue(zone.classList.contains('drop-zone'))
-      // assert.equal(dt.dropEffect, 'link')
-      // assert.equal(dt.effectAllowed, 'link')
-    })
-
-    it('does nothing when no dataTransfer', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const e = new DragEvent('dragenter')
-      element['handleInheritanceDragEnter'](e)
-      assert.isFalse(zone.classList.contains('drop-zone'))
-    })
-
-    it('does nothing when not an entity', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const dt = new DataTransfer()
-      dt.setData('text/kind', 'invalid')
-      const e = new DragEvent('dragenter', { dataTransfer: dt })
-      zone.dispatchEvent(e)
-      assert.isFalse(zone.classList.contains('drop-zone'))
-    })
-  })
-
-  describe('handleInheritanceDragOver()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('prevents default', async () => {
-      const element = await basicFixture(root, selected)
-      const dt = new DataTransfer()
-      dt.setData('text/kind', DomainEntityKind)
-      dt.setData(DomainEntityKind, '')
-      const e = new DragEvent('dragover', { dataTransfer: dt })
-      const spy = sinon.spy(e, 'preventDefault')
-      element['handleInheritanceDragOver'](e)
-      assert.isTrue(spy.calledOnce)
-    })
-
-    it('does nothing when no dataTransfer', async () => {
-      const element = await basicFixture(root, selected)
-      const e = new DragEvent('dragover')
-      const spy = sinon.spy(e, 'preventDefault')
-      element['handleInheritanceDragOver'](e)
-      assert.isFalse(spy.called)
-    })
-
-    it('does nothing when not an entity', async () => {
-      const element = await basicFixture(root, selected)
-      const dt = new DataTransfer()
-      dt.setData('text/kind', 'invalid')
-      const e = new DragEvent('dragover', { dataTransfer: dt })
-      const spy = sinon.spy(e, 'preventDefault')
-      element['handleInheritanceDragOver'](e)
-      assert.isFalse(spy.called)
-    })
-  })
-
-  describe('handleInheritanceDragLeave()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      selected = e1.key
-    })
-
-    it('removes drop-zone class', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      zone.classList.add('drop-zone')
-      const dt = new DataTransfer()
-      dt.setData('text/kind', DomainEntityKind)
-      dt.setData(DomainEntityKind, '')
-      const e = new DragEvent('dragleave', { dataTransfer: dt })
-      zone.dispatchEvent(e)
-      assert.isFalse(zone.classList.contains('drop-zone'))
-    })
-
-    it('does nothing when no dataTransfer', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      zone.classList.add('drop-zone')
-      const e = new DragEvent('dragleave')
-      zone.dispatchEvent(e)
-      assert.isTrue(zone.classList.contains('drop-zone'))
-    })
-  })
-
-  describe('handleInheritanceDrop()', () => {
-    let root: DataDomain
-    let selected: string
-    let e1: DomainEntity
-    let e2: DomainEntity
-    let dm1: DomainModel
-
-    beforeEach(async () => {
-      root = new DataDomain()
-      dm1 = root.addModel({ key: 'dm1', info: { name: 'dm1' } })
-      e1 = dm1.addEntity({ key: 'e1', info: { name: 'e1' } })
-      e2 = dm1.addEntity({ key: 'e2', info: { name: 'e2' } })
-      selected = e1.key
-    })
-
-    it('adds a parent', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const dt = new DataTransfer()
-      dt.setData('text/key', e2.key)
-      dt.setData('text/kind', DomainEntityKind)
-      dt.setData(DomainEntityKind, '')
-      const e = new DragEvent('drop', { dataTransfer: dt })
-      zone.dispatchEvent(e)
-      assert.equal([...e1.listParents()].length, 1)
-      assert.equal([...e1.listParents()][0].key, e2.key)
-    })
-
-    it('removes drop-zone class', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      zone.classList.add('drop-zone')
-      const dt = new DataTransfer()
-      dt.setData('text/key', e2.key)
-      dt.setData('text/kind', DomainEntityKind)
-      dt.setData(DomainEntityKind, '')
-      const e = new DragEvent('drop', { dataTransfer: dt })
-      zone.dispatchEvent(e)
-      assert.isFalse(zone.classList.contains('drop-zone'))
-    })
-
-    it('does nothing when no dataTransfer', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const e = new DragEvent('drop')
-      assert.doesNotThrow(() => zone.dispatchEvent(e))
-    })
-
-    it('does nothing when not an entity', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const dt = new DataTransfer()
-      dt.setData('text/key', 'invalid')
-      dt.setData('text/kind', 'invalid')
-      const e = new DragEvent('drop', { dataTransfer: dt })
-      assert.doesNotThrow(() => zone.dispatchEvent(e))
-    })
-
-    it('dispatches change event', async () => {
-      const element = await basicFixture(root, selected)
-      const zone = element.renderRoot.querySelector('.inheritance-section') as HTMLElement
-      assert.ok(zone)
-      const dt = new DataTransfer()
-      dt.setData('text/key', e2.key)
-      dt.setData('text/kind', DomainEntityKind)
-      dt.setData(DomainEntityKind, '')
-      const e = new DragEvent('drop', { dataTransfer: dt })
-      const spy = sinon.spy()
-      element.addEventListener('change', spy)
-      zone.dispatchEvent(e)
-      assert.isTrue(spy.calledOnce)
-    })
-  })
-})