@internetarchive/modal-manager 2.0.5-webdev-8155.8 → 2.0.5

package/test/modal-manager.test.ts

@@ -5,7 +5,7 @@ import {
   nextFrame,
   fixtureCleanup,
 } from '@open-wc/testing-helpers';
-import { describe, test, expect, afterEach } from 'vitest';
+import { describe, it, expect, afterEach } from 'vitest';
 import { TemplateResult, html } from 'lit';
 
 import '../src/modal-manager';
@@ -21,7 +21,7 @@ describe('Modal Manager', () => {
     fixtureCleanup();
   });
 
-  test('defaults to closed', async () => {
+  it('defaults to closed', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -29,7 +29,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal('closed');
   });
 
-  test('can be closed by calling closeModal', async () => {
+  it('can be closed by calling closeModal', async () => {
     const el = (await fixture(html`
       <modal-manager .mode=${ModalManagerMode.Open}></modal-manager>
     `)) as ModalManager;
@@ -45,7 +45,7 @@ describe('Modal Manager', () => {
     expect(el.customModalContent).to.equal(undefined);
   });
 
-  test('can be closed by clicking on the backdrop', async () => {
+  it('can be closed by clicking on the backdrop', async () => {
     const el = (await fixture(html`
       <modal-manager .mode=${ModalManagerMode.Open}></modal-manager>
     `)) as ModalManager;
@@ -59,7 +59,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal('closed');
   });
 
-  test('emits a modeChanged event when opening', async () => {
+  it('emits a modeChanged event when opening', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -73,7 +73,7 @@ describe('Modal Manager', () => {
     expect(response.detail.mode).to.equal(ModalManagerMode.Open);
   });
 
-  test('emits a modeChanged event when closing', async () => {
+  it('emits a modeChanged event when closing', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -90,7 +90,7 @@ describe('Modal Manager', () => {
     expect(response.detail.mode).to.equal(ModalManagerMode.Closed);
   });
 
-  test('can show a modal', async () => {
+  it('can show a modal', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -101,7 +101,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal(ModalManagerMode.Open);
   });
 
-  test('sets the --containerHeight CSS property when the window resizes', async () => {
+  it('sets the --containerHeight CSS property when the window resizes', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -118,7 +118,7 @@ describe('Modal Manager', () => {
     expect(propAfter).to.not.equal('');
   });
 
-  test('calls the userClosedModalCallback when the user taps the backdrop', async () => {
+  it('calls the userClosedModalCallback when the user taps the backdrop', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -143,7 +143,7 @@ describe('Modal Manager', () => {
     expect(callbackCalled).to.equal(true);
   });
 
-  test('does not call the userClosedModalCallback when the modal just closes', async () => {
+  it('does not call the userClosedModalCallback when the modal just closes', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -163,7 +163,7 @@ describe('Modal Manager', () => {
     expect(callbackCalled).to.equal(false);
   });
 
-  test('calls the userPressedLeftNavButtonCallback when the user clicks the left nav button', async () => {
+  it('calls the userPressedLeftNavButtonCallback when the user clicks the left nav button', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -191,7 +191,7 @@ describe('Modal Manager', () => {
     expect(callbackCalled).to.equal(true);
   });
 
-  test('mode is set to closed when close button is pressed', async () => {
+  it('mode is set to closed when close button is pressed', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -212,7 +212,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal('closed');
   });
 
-  test('mode is set to closed when close button gets spacebar pressed', async () => {
+  it('mode is set to closed when close button gets spacebar pressed', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -235,7 +235,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal('closed');
   });
 
-  test('mode remains open when close button gets non-button keypress', async () => {
+  it('mode remains open when close button gets non-button keypress', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -258,7 +258,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal('open');
   });
 
-  test('allows the user to close by clicking on the backdrop if configured to', async () => {
+  it('allows the user to close by clicking on the backdrop if configured to', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -277,7 +277,7 @@ describe('Modal Manager', () => {
     expect(el.mode).to.equal('closed');
   });
 
-  test("doesn't allow the user to close by clicking on the backdrop if configured to", async () => {
+  it("doesn't allow the user to close by clicking on the backdrop if configured to", async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManagerInterface;
@@ -296,7 +296,7 @@ describe('Modal Manager', () => {
     expect(el.getMode()).to.equal('open');
   });
 
-  test('ia logo should not visible on modal', async () => {
+  it('ia logo should not visible on modal', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManagerInterface;
@@ -310,7 +310,7 @@ describe('Modal Manager', () => {
     expect(logoIcon).to.not.exist;
   });
 
-  test('should trap Tab key', async () => {
+  it('should trap Tab key', async () => {
     const el = (await fixture(html`
       <modal-manager></modal-manager>
     `)) as ModalManager;
@@ -358,7 +358,7 @@ describe('Modal Manager', () => {
     expect(modal?.shadowRoot?.activeElement).to.equal(closeButton);
   });
 
-  test('returns keyboard focus to the triggering element on close', async () => {
+  it('returns keyboard focus to the triggering element on close', async () => {
     const config = new ModalConfig();
     const el = (await fixture(html`
       <div>

package/test/modal-template.test.ts

@@ -1,12 +1,12 @@
 import { fixture, oneEvent } from '@open-wc/testing-helpers';
-import { describe, test, expect } from 'vitest';
+import { describe, it, expect } from 'vitest';
 import { html } from 'lit';
 import '../src/modal-template';
 import { ModalConfig } from '../src/modal-config';
 import type { ModalTemplate } from '../src/modal-template';
 
 describe('Modal Template', () => {
-  test('has correct default configuration', async () => {
+  it('has correct default configuration', async () => {
     const el = await fixture<ModalTemplate>(html`
       <modal-template></modal-template>
     `);
@@ -23,7 +23,7 @@ describe('Modal Template', () => {
     expect('hidden' in processingLogo!.classList);
   });
 
-  test('does not show the title if one not provided', async () => {
+  it('does not show the title if one not provided', async () => {
     const config = new ModalConfig();
     config.title = undefined;
 
@@ -35,7 +35,7 @@ describe('Modal Template', () => {
     expect(title).to.not.exist;
   });
 
-  test('emits closeButtonPressed event when close button is pressed', async () => {
+  it('emits closeButtonPressed event when close button is pressed', async () => {
     const el = await fixture<ModalTemplate>(html`
       <modal-template></modal-template>
     `);
@@ -49,7 +49,7 @@ describe('Modal Template', () => {
     expect(response).to.exist;
   });
 
-  test('emits closeButtonPressed event when close button gets spacebar pressed', async () => {
+  it('emits closeButtonPressed event when close button gets spacebar pressed', async () => {
     const el = await fixture<ModalTemplate>(html`
       <modal-template></modal-template>
     `);
@@ -64,7 +64,7 @@ describe('Modal Template', () => {
     expect(response).to.exist;
   });
 
-  test('emits leftNavButtonPressed event when left nav button is pressed', async () => {
+  it('emits leftNavButtonPressed event when left nav button is pressed', async () => {
     const config = new ModalConfig();
     config.showLeftNavButton = true;
     const el = await fixture<ModalTemplate>(html`
@@ -81,7 +81,7 @@ describe('Modal Template', () => {
     expect(response).to.exist;
   });
 
-  test('emits leftNavButtonPressed event when left nav button gets spacebar pressed', async () => {
+  it('emits leftNavButtonPressed event when left nav button gets spacebar pressed', async () => {
     const config = new ModalConfig();
     config.showLeftNavButton = true;
     const el = await fixture<ModalTemplate>(html`
@@ -98,7 +98,7 @@ describe('Modal Template', () => {
     expect(response).to.exist;
   });
 
-  test('shows the processing indicator if configured to', async () => {
+  it('shows the processing indicator if configured to', async () => {
     const config = new ModalConfig();
     config.showProcessingIndicator = true;
 
@@ -111,7 +111,7 @@ describe('Modal Template', () => {
     expect('hidden' in classList).to.equal(false);
   });
 
-  test('shows the left nav button if configured to', async () => {
+  it('shows the left nav button if configured to', async () => {
     const config = new ModalConfig();
     config.showLeftNavButton = true;
     const el = await fixture<ModalTemplate>(html`
@@ -122,7 +122,7 @@ describe('Modal Template', () => {
     expect(leftNavButton).to.exist;
   });
 
-  test('hides the left nav button if configured to', async () => {
+  it('hides the left nav button if configured to', async () => {
     const config = new ModalConfig();
     config.showCloseButton = false;
     const el = await fixture<ModalTemplate>(html`
@@ -133,7 +133,7 @@ describe('Modal Template', () => {
     expect(closeButton).to.not.exist;
   });
 
-  test('uses custom text for the left nav button if configured to', async () => {
+  it('uses custom text for the left nav button if configured to', async () => {
     const config = new ModalConfig();
     config.showLeftNavButton = true;
     config.leftNavButtonText = 'Previous';
@@ -147,7 +147,7 @@ describe('Modal Template', () => {
     expect(leftNavButton?.innerHTML).to.contain('Previous');
   });
 
-  test('does not use any text for the left nav button if not configured to', async () => {
+  it('does not use any text for the left nav button if not configured to', async () => {
     const config = new ModalConfig();
     config.showLeftNavButton = true;
 
@@ -159,7 +159,7 @@ describe('Modal Template', () => {
     expect(leftNavButton?.innerHTML).not.to.contain('Previous');
   });
 
-  test('shows the close button if configured to', async () => {
+  it('shows the close button if configured to', async () => {
     const config = new ModalConfig();
     config.showCloseButton = true;
     const el = await fixture<ModalTemplate>(html`
@@ -170,7 +170,7 @@ describe('Modal Template', () => {
     expect(closeButton).to.exist;
   });
 
-  test('hides the close button if configured to', async () => {
+  it('hides the close button if configured to', async () => {
     const config = new ModalConfig();
     config.showCloseButton = false;
     const el = await fixture<ModalTemplate>(html`
@@ -181,7 +181,7 @@ describe('Modal Template', () => {
     expect(closeButton).to.not.exist;
   });
 
-  test('shows the properties from the config', async () => {
+  it('shows the properties from the config', async () => {
     const config = new ModalConfig();
     config.title = html`Boop`;
     config.subtitle = html`Bop`;

package/tsconfig.json

@@ -1,11 +1,11 @@
 {
   "compilerOptions": {
-    "target": "esnext",
-    "module": "esnext",
+    "target": "es2022",
+    "module": "es2022",
     "moduleResolution": "bundler",
     "noEmitOnError": true,
     "lib": [
-      "esnext",
+      "es2022",
       "dom"
     ],
     "strict": true,
@@ -19,7 +19,7 @@
     "declaration": true,
     "rootDir": "./",
     "skipLibCheck": true,
-    "useDefineForClassFields": false,
+    "useDefineForClassFields": false
   },
   "include": ["**/*.ts"]
 }

package/vitest.config.ci.ts

@@ -1,6 +1,6 @@
 /// <reference types="vitest" />
 import { defineConfig, mergeConfig } from 'vitest/config';
-import { playwright } from '@vitest/browser-playwright'
+import { playwright } from '@vitest/browser-playwright';
 import viteConfig from './vite.config';
 
 // https://vitest.dev/config
@@ -8,7 +8,7 @@ export default mergeConfig(
   viteConfig,
   defineConfig({
     server: {
-      host: '0.0.0.0',
+      host: '127.0.0.1',
       port: 8080,
     },
     test: {

package/.vscode/tasks.json

@@ -1,12 +0,0 @@
-{
-  "version": "2.0.0",
-  "tasks": [
-    {
-      "label": "Watch coverage on open",
-      "command": "${command:coverage-gutters.watchCoverageAndVisibleEditors}",
-      "runOptions": {
-        "runOn": "folderOpen"
-      }
-    }
-  ]
-}