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.

Sign up for GitHub

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

Jump to bottom

Addon-a11y: Support manual run #8883

Merged
merged 7 commits into from Jan 13, 2020
Merged

Addon-a11y: Support manual run #8883

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d73733d
addon-a11y: allow manual run
donaldpipowitch Nov 19, 2019
aa5a654
updated tests
donaldpipowitch Nov 25, 2019
268cdb2
Merge branch 'next' into 8126-addon-a11y--allow-manual-run
ndelangen Dec 6, 2019
1e30b75
Merge branch 'next-6.0.0' into pr/donaldpipowitch/8883
ndelangen Dec 21, 2019
e368e57
Merge branch 'next-6.0.0' into 8126-addon-a11y--allow-manual-run
gaetanmaisse Jan 12, 2020
a03a2c4
fix initial render bug
donaldpipowitch Jan 13, 2020
f567dad
Merge branch '8126-addon-a11y--allow-manual-run' of github.com:donald…
donaldpipowitch Jan 13, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
17 changes: 10 additions & 7 deletions addons/a11y/src/components/A11YPanel.tsx
View file
Open in desktop
Expand Up @@ -20,26 +20,29 @@ export enum RuleType {
INCOMPLETION,
}

const RotatingIcons = styled(Icons)(({ theme }) => ({
const Icon = styled(Icons)({
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@donaldpipowitch I needed to keep an Icon component with height and width otherwise the check icon from e368e57#diff-3250ce08c136d40dd47659131333a6a7R213 is not displayed

height: 12,
width: 12,
marginRight: 4,
});

const RotatingIcon = styled(Icon)(({ theme }) => ({
animation: `${theme.animation.rotate360} 1s linear infinite;`,
}));

const Passes = styled.span(({ theme }) => ({
const Passes = styled.span<{}>(({ theme }) => ({
color: theme.color.positive,
}));

const Violations = styled.span(({ theme }) => ({
const Violations = styled.span<{}>(({ theme }) => ({
color: theme.color.negative,
}));

const Incomplete = styled.span(({ theme }) => ({
const Incomplete = styled.span<{}>(({ theme }) => ({
color: theme.color.warning,
}));

const Centered = styled.span({
const Centered = styled.span<{}>({
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
Expand Down Expand Up @@ -195,7 +198,7 @@ export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
case 'running':
return (
<Centered>
<RotatingIcons inline icon="sync" /> Please wait while the accessibility scan is running
<RotatingIcon inline icon="sync" /> Please wait while the accessibility scan is running
...
</Centered>
);
Expand All @@ -207,7 +210,7 @@ export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
'Rerun tests'
) : (
<Fragment>
<Icons inline icon="check" /> Tests completed
<Icon inline icon="check" /> Tests completed
</Fragment>
);
return (
Expand Down
6 changes: 4 additions & 2 deletions addons/a11y/src/index.ts
View file
Open in desktop
Expand Up @@ -14,7 +14,7 @@ interface Setup {
manual: boolean;
}

let setup: Setup = { element: null, config: {}, options: {}, manual: false };
let setup: Setup = { element: undefined, config: {}, options: {}, manual: false };

const getElement = () => {
const storyRoot = document.getElementById('story-root');
Expand Down Expand Up @@ -66,7 +66,9 @@ export const withA11y = makeDecorator({
storedDefaultSetup = null;
}

addons.getChannel().on(EVENTS.REQUEST, () => run(setup.element, setup.config, setup.options));
addons
.getChannel()
.on(EVENTS.REQUEST, () => run(setup.element as ElementContext, setup.config, setup.options));
addons.getChannel().emit(EVENTS.MANUAL, setup.manual);

return getStory(context);
Expand Down
You are viewing a condensed version of this merge commit. You can view the full changes here.