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.

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

fix(cdrmodal): fixes the issue where screen readers can read content … #151

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,9 @@ Runs both unit and e2e/accesibility tests.

### Visual Regression Testing

> [!NOTE]
> this has been temporarily disabled due to Vue3 compatibility issues.

Check [backstop](https://github.com/garris/BackstopJS) for general configuration questions.

Our visual regressions audits can be performed against all patterns documented within the project's component proving grounds. To do so, follow the steps below:
Expand Down
58 changes: 44 additions & 14 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,16 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>rei-cedar</title>
<meta name="description" content="Welcome to the REI Digital Design System presentation framework. A home for modular components based on our evolving design patterns.">
<meta name="author" content="REI">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="cdr-fonts.css">
<link rel="stylesheet" href="reset.css">
<!-- <link rel="stylesheet" href="./dist/cedar-compiled.css"> -->
</head>
<body>
<div id="main"></div>
<script type="module" src="./src/dev/index.js"></script>
</body>
</html>

<head>
<title>rei-cedar</title>
<meta
name="description"
content="Welcome to the REI Digital Design System presentation framework. A home for modular components based on our evolving design patterns."
>
<meta
name="author"
content="REI"
>
<meta
name="viewport"
content="width=device-width"
>
<link
rel="stylesheet"
href="cdr-fonts.css"
>
<link
rel="stylesheet"
href="reset.css"
>
<!-- <link rel="stylesheet" href="./dist/cedar-compiled.css"> -->
</head>

<body>
<div id="main"></div>
<!-- TODO: cover in unit tests, remove this -->
<!-- start: testing modal content show/hide -->
<div
aria-hidden="true"
style="opacity: 0;"
>something already aria-hidden</div>
<div hidden>something display: none;</div>
<div style="opacity: 0;">another div of outside content, not aria-hidden</div>
Comment on lines +31 to +39
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

TODO this will be removed, for display/testing only

<!-- end: testing modal content show/hide -->
<script
type="module"
src="./src/dev/index.js"
></script>
</body>

</html>
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@
"url": "https://github.com/rei/rei-cedar.git"
},
"scripts": {
"prepare": "npm run build",
"prepublishOnly": "npm-run-all lint build",
"dev": "vite",
"build": "vue-tsc && vite build && npm run build:umd && npm run build:extractcss && npm run build:icons && npm run build:docgen",
Expand Down
Loading
Loading