kopia lustrzana https://github.com/shoelace-style/shoelace
fixes #1121
rodzic
31f16c4680
commit
3c66d2ab99
|
@ -18,6 +18,7 @@ New versions of Shoelace are released as-needed and generally occur when a criti
|
|||
- Fixed a bug in `<sl-color-picker>` that logged a console error when parsing swatches with whitespace
|
||||
- Fixed a bug in `<sl-color-picker>` that caused selected colors to be wrong due to incorrect HSV calculations
|
||||
- Fixed a bug in `<sl-radio-button>` that caused the checked button's right border to be incorrect [#1110](https://github.com/shoelace-style/shoelace/issues/1110)
|
||||
- Fixed a bug in `<sl-spinner>` that caused the animation to stop working correctly in Safari [#1121](https://github.com/shoelace-style/shoelace/issues/1121)
|
||||
|
||||
## 2.0.0-beta.88
|
||||
|
||||
|
|
|
@ -46,17 +46,17 @@ export default css`
|
|||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
rotate: 0deg;
|
||||
transform: rotate(0deg);
|
||||
stroke-dasharray: 0.01em, 2.75em;
|
||||
}
|
||||
|
||||
50% {
|
||||
rotate: 450deg;
|
||||
transform: rotate(450deg);
|
||||
stroke-dasharray: 1.375em, 1.375em;
|
||||
}
|
||||
|
||||
100% {
|
||||
rotate: 1080deg;
|
||||
transform: rotate(1080deg);
|
||||
stroke-dasharray: 0.01em, 2.75em;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,21 +2,29 @@ import { expect, fixture, html } from '@open-wc/testing';
|
|||
import type SlSpinner from './spinner';
|
||||
|
||||
describe('<sl-spinner>', () => {
|
||||
let el: SlSpinner;
|
||||
|
||||
describe('when provided no parameters', () => {
|
||||
before(async () => {
|
||||
el = await fixture<SlSpinner>(html` <sl-spinner></sl-spinner> `);
|
||||
});
|
||||
|
||||
it('should pass accessibility tests', async () => {
|
||||
await expect(el).to.be.accessible();
|
||||
const spinner = await fixture<SlSpinner>(html` <sl-spinner></sl-spinner> `);
|
||||
await expect(spinner).to.be.accessible();
|
||||
});
|
||||
|
||||
it('should have a role of "status".', () => {
|
||||
// https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions
|
||||
const base = el.shadowRoot!.querySelector('[part~="base"]')!;
|
||||
it('should have a role of "status".', async () => {
|
||||
const spinner = await fixture<SlSpinner>(html` <sl-spinner></sl-spinner> `);
|
||||
const base = spinner.shadowRoot!.querySelector('[part~="base"]')!;
|
||||
expect(base).have.attribute('role', 'progressbar');
|
||||
});
|
||||
|
||||
it('should use "transform: rotate(x)" instead of "rotate: x" when animating', async () => {
|
||||
const spinner = await fixture<SlSpinner>(html` <sl-spinner></sl-spinner> `);
|
||||
const indicator = spinner.shadowRoot!.querySelector('.spinner__indicator')!;
|
||||
|
||||
//
|
||||
// This matrix is the computed value when using `transform: rotate(x)` on the indicator. When using `rotate: x`,
|
||||
// it will be "none" instead.
|
||||
//
|
||||
// Related: https://github.com/shoelace-style/shoelace/issues/1121
|
||||
//
|
||||
expect(getComputedStyle(indicator).transform).to.equal('matrix(1, 0, 0, 1, 0, 0)');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Ładowanie…
Reference in New Issue