mirror of
https://github.com/shoelace-style/webawesome.git
synced 2026-01-12 04:09:12 +00:00
* continued ssr work * continued ssr work * prettier * all components now rendering * everything finally works * fix type issues * working on breadcrumb * working on breadcrumb * radio group * convert all tests to ssr * prettier * test suite finally passing * add layout stuff * add changelog * fix TS issue * fix tests * fixing deploy stuff * get QR code displaying * fix tests * fix tests * prettier * condense hydration stuff * prettier * comment out range test * fixing issues * use base fixtures * fixing examples * dont vendor * fix import of hydration support * adding notes * add notesg * add ssr loader * fix build * prettier * add notes * add notes * prettier * fixing bundled stuff * remove cdn * remove cdn * prettier * fiixng tests * prettier * split jobs?? * prettier * fix build stuff * add reset mouse and await aTimeout * prettier * fix improper tests * prettier * bail on first * fix linting * only test form with client * redundancy on ssr-loader?? * maybe this will work * prettier * try callout now * fix form.test.ts * fix form.test.ts * prettier * fix forms * fix forms * try again * prettier * add some awaits * prettier * comment out broken SSR tests * prettier * comment out broken SSR tests * prettier * dont skip in CI * upgrade playwright to beta * prettier * try some trickery * try some trickery * await updateComplete * try to fix form.test.ts * import hydrateable elements 1 time * prettier * fix input defaultValue issues * fix form controls to behave like their native counterpartS * add changelog entry * prettier * fix unexpected behavior with range / button
71 lines
2.4 KiB
TypeScript
71 lines
2.4 KiB
TypeScript
import { expect } from '@open-wc/testing';
|
|
import { fixtures } from '../../internal/test/fixture.js';
|
|
import { html } from 'lit';
|
|
import type WaProgressRing from './progress-ring.js';
|
|
|
|
describe('<wa-progress-ring>', () => {
|
|
let el: WaProgressRing;
|
|
|
|
for (const fixture of fixtures) {
|
|
describe(`with "${fixture.type}" rendering`, () => {
|
|
describe('when provided just a value parameter', () => {
|
|
beforeEach(async () => {
|
|
el = await fixture<WaProgressRing>(html`<wa-progress-ring value="25"></wa-progress-ring>`);
|
|
});
|
|
|
|
it('should pass accessibility tests', async () => {
|
|
await expect(el).to.be.accessible();
|
|
});
|
|
});
|
|
|
|
describe('when provided a title, and value parameter', () => {
|
|
let base: HTMLDivElement;
|
|
|
|
beforeEach(async () => {
|
|
el = await fixture<WaProgressRing>(
|
|
html`<wa-progress-ring title="Titled Progress Ring" value="25"></wa-progress-ring>`
|
|
);
|
|
base = el.shadowRoot!.querySelector('[part~="base"]')!;
|
|
});
|
|
|
|
it('should pass accessibility tests', async () => {
|
|
await expect(el).to.be.accessible();
|
|
});
|
|
|
|
it('uses the value parameter on the base, as aria-valuenow', () => {
|
|
expect(base).attribute('aria-valuenow', '25');
|
|
});
|
|
|
|
it('translates the value parameter to a percentage, and uses translation on the base, as percentage css variable', () => {
|
|
expect(base).attribute('style', '--percentage: 0.25');
|
|
});
|
|
});
|
|
|
|
describe('when provided a ariaLabel, and value parameter', () => {
|
|
beforeEach(async () => {
|
|
el = await fixture<WaProgressRing>(
|
|
html`<wa-progress-ring ariaLabel="Labelled Progress Ring" value="25"></wa-progress-ring>`
|
|
);
|
|
});
|
|
|
|
it('should pass accessibility tests', async () => {
|
|
await expect(el).to.be.accessible();
|
|
});
|
|
});
|
|
|
|
describe('when provided a ariaLabelledBy, and value parameter', () => {
|
|
beforeEach(async () => {
|
|
el = await fixture<WaProgressRing>(html`
|
|
<label id="labelledby">Progress Ring Label</label>
|
|
<wa-progress-ring ariaLabelledBy="labelledby" value="25"></wa-progress-ring>
|
|
`);
|
|
});
|
|
|
|
it('should pass accessibility tests', async () => {
|
|
await expect(el).to.be.accessible();
|
|
});
|
|
});
|
|
});
|
|
}
|
|
});
|