@uuv/a11y 1.0.0-beta.1 → 1.0.0-beta.10

package/CHANGELOG.md

@@ -1,3 +1,75 @@
+## [1.0.0-beta.10](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.9...a11y-v1.0.0-beta.10) (2024-02-15)
+
+
+### Bug Fixes
+
+* **runner-playwright:** update dependency axe-core to v4.8.4 ([1db34e2](https://github.com/Orange-OpenSource/uuv/commit/1db34e26b498bfc83d47cfd98064faa1aa65f558))
+
+## [1.0.0-beta.9](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.8...a11y-v1.0.0-beta.9) (2024-02-13)
+
+
+### Bug Fixes
+
+* update dependency multiple-cucumber-html-reporter to v3.6.2 ([95d85c3](https://github.com/Orange-OpenSource/uuv/commit/95d85c3f29ff261232f75c83175d795b63766a89))
+
+## [1.0.0-beta.8](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.7...a11y-v1.0.0-beta.8) (2024-02-13)
+
+
+### Features
+
+* **a11y:** add rgaa criteria 5.1 to 5.5, [#451](https://github.com/Orange-OpenSource/uuv/issues/451) ([fa3b369](https://github.com/Orange-OpenSource/uuv/commit/fa3b3693e102b54e1d72321aba573e66c864f4e3))
+* **a11y:** add rgaa criteria 5.6 to 5.8, [#451](https://github.com/Orange-OpenSource/uuv/issues/451) ([9cdf4ad](https://github.com/Orange-OpenSource/uuv/commit/9cdf4ad0e5ba16d7b8ddb90e014d96fc741acc17))
+
+## [1.0.0-beta.7](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.6...a11y-v1.0.0-beta.7) (2024-01-24)
+
+
+### Features
+
+* **a11y:** add rgaa topic 2, [#432](https://github.com/Orange-OpenSource/uuv/issues/432) ([#450](https://github.com/Orange-OpenSource/uuv/issues/450)) ([231d95b](https://github.com/Orange-OpenSource/uuv/commit/231d95b48ecfbeb0c86f44d0de0ca8c68df7b9f1))
+
+## [1.0.0-beta.6](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.5...a11y-v1.0.0-beta.6) (2024-01-23)
+
+
+### Features
+
+* **a11y:** add RGAA 1.1.6 and 1.1.3, [#429](https://github.com/Orange-OpenSource/uuv/issues/429) ([0e65889](https://github.com/Orange-OpenSource/uuv/commit/0e65889b479651c27e16c29fdb8e5123fe689f03))
+
+
+### Bug Fixes
+
+* **runner-playwright:** update dependency axe-core to v4.8.3 ([4623485](https://github.com/Orange-OpenSource/uuv/commit/46234851677cf0e5f0479fe30bc786ae2a607f1e))
+
+## [1.0.0-beta.5](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.4...a11y-v1.0.0-beta.5) (2024-01-21)
+
+
+### Bug Fixes
+
+* **a11y:** update dependency @testing-library/dom to v9.3.4 ([368b6b4](https://github.com/Orange-OpenSource/uuv/commit/368b6b4210f83d2da7695a0bfedd8ac593df171a))
+* **assistant:** fix assistant and enable uuv test for assistant, [#437](https://github.com/Orange-OpenSource/uuv/issues/437) ([da82e1b](https://github.com/Orange-OpenSource/uuv/commit/da82e1b588a391eb24573ac8c3f2db18cfdbf5a5))
+* **deps:** update dependency @easyops-cn/docusaurus-search-local to v0.40.1 ([d5ed3d7](https://github.com/Orange-OpenSource/uuv/commit/d5ed3d75f44e2b83af81fcd7227521dea00371e6))
+
+## [1.0.0-beta.4](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.3...a11y-v1.0.0-beta.4) (2024-01-11)
+
+
+### Features
+
+* **a11y:** add a contains sentence for a11y rgaa, [#424](https://github.com/Orange-OpenSource/uuv/issues/424) ([297cc33](https://github.com/Orange-OpenSource/uuv/commit/297cc3378798d1eb9c973a2038423ae6f874f70f))
+
+## [1.0.0-beta.3](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.2...a11y-v1.0.0-beta.3) (2024-01-08)
+
+
+### Features
+
+* **a11y:** reduce @uuv/a11y bundle size, [#330](https://github.com/Orange-OpenSource/uuv/issues/330) ([139b85a](https://github.com/Orange-OpenSource/uuv/commit/139b85a56e2ce4b8f370df4f6d410a9a1807e3b6))
+
+## [1.0.0-beta.2](https://github.com/Orange-OpenSource/uuv/compare/a11y-v1.0.0-beta.1...a11y-v1.0.0-beta.2) (2024-01-08)
+
+
+### Bug Fixes
+
+* **a11y:** fix post first publish, [#330](https://github.com/Orange-OpenSource/uuv/issues/330) ([76cf65b](https://github.com/Orange-OpenSource/uuv/commit/76cf65ba219f6128c58ecdec608d3cb4fe72bcc9))
+* **a11y:** update unpkg usage and stackblitz link, [#330](https://github.com/Orange-OpenSource/uuv/issues/330) ([6032415](https://github.com/Orange-OpenSource/uuv/commit/6032415fdf16ae1be23e96785e7c66b779d8cbf9))
+
 ## 1.0.0-beta.1 (2024-01-08)
 
 

package/CONTRIBUTING.md

@@ -0,0 +1,46 @@
+# Contributors guide
+
+First, read the general [CONTRIBUTING](../../CONTRIBUTING.md) file
+
+## How Contribue to @uuv/a11y ?
+This [page](./STRUCTURE.md) gives you an overview of the @uuv/a11y module structure.
+
+### Add new RGAA rules
+1. Identify the file concerned by the new rule you want to add <br>
+For example :
+   - a rule on test **1**.1.4 will concern the file `a11y/src/lib/reference/rgaa/rules/1-image.ts`
+   - a rule on test **7**.1.1 will concern the file `a11y/src/lib/reference/rgaa/rules/7-script.ts`
+2. Make sure the rule doesn't already exist in the file
+3. Add your rule to the file, a rule can be :
+   - `Auto` : it can be checked automatically, then you can follow the example below :
+       ```typescript
+       AutoCheckA11yRule.from({
+            reference: "RGAA",
+            criterion: "1.1",
+            id: "1.1.5",
+           elementType: "svg",
+           query: new ByTagQuery([
+               "svg:not([role=img])"
+           ]),
+           description: "svg has no image role",
+           help: "set image role to svg"
+        })
+        ```
+   - `Manual` : It must be checked manually by a human, then you can follow the example below :
+       ```typescript
+       ManualCheckA11yRule.from({
+            reference: "RGAA",
+            criterion: "1.3",
+            wcag: "4.1.2 A",
+            id: "1.3.1",
+            elementType: "image",
+            query: new ByTagQuery(informativeContent.image.buildSelectorWithAttributes()),
+            attributes: informativeContent.image.ATTRIBUTES,
+            description: "if present, attributes alt, title, aria-label, aria-labelledby must be relevant",
+            help: "adapt these attributes to be relevant"
+       })
+        ```
+   **Adding a new rule may require you to create a new query, in which case remember to write the corresponding automated tests in the `a11y/test/query/**` directory and export it `index.ts` of same directory.**
+
+
+4. Create or enhance the automated topic test file in the directory `a11y/test/checker/**`.

package/LICENSE

@@ -2,7 +2,7 @@
 
                                     MIT License
 
-         Copyright (c) 2023 Orange
+         Copyright (c) 2024 Orange
 
         Permission is hereby granted, free of charge, to any person obtaining a copy of
         this software and associated documentation files (the "Software"), to deal in

package/README.md

@@ -68,7 +68,7 @@ The following references are available :
 
 For each criterion of the RGAA, the following algorithm is executed :
 
- ![Diagram a11Y RGAA](/docs/diagram-a11y-rgaa.png)
+ ![Diagram a11Y RGAA](https://unpkg.com/@uuv/a11y/docs/diagram-a11y-rgaa.png)
 
 **Consult [this page](https://orange-opensource.github.io/uuv/docs/tools/uuv-a11y#rgaa) to find out which RGAA verifications are implemented in the library**
 </p>  
@@ -77,21 +77,21 @@ For each criterion of the RGAA, the following algorithm is executed :
 ### With UNPKG
 1.  Add script tag to import @uuv/a11y in your html page :
     ```html
-    <script src="https://unpkg.com/@uuv/a11y/dist/bundle/uuv-a11y.bundle.js">
+    <script src="https://unpkg.com/@uuv/a11y/bundle/uuv-a11y.bundle.js">
     </script>
     ```
 2. Add script tag to execute
     ```html
-    <script>
-      const rgaaChecker = new uuvA11y.RgaaChecker(url, enabledRules);
+    <script type="module">
+      const rgaaChecker = new uuvA11y.RgaaChecker(window.location.url);
       const result = await rgaaChecker.validate().toPromise();
       // Print complete result
-      console.log(result);
+      console.log('result', result);
       // Print result summary group by criteria
-      console.log(result.summary());
+      console.log('summary', result.summary());
     </script>
     ```
-  [Stackblitz example](https://stackblitz.com/edit/web-platform-fihgra?file=index.html)
+  [Stackblitz example](https://stackblitz.com/edit/web-platform-fihgra?devToolsHeight=33&file=index.html)
 
 ### As a dependency
 1. Import @uuv/a11y npm dependency
@@ -113,77 +113,57 @@ For each criterion of the RGAA, the following algorithm is executed :
     // Print result summary group by criteria
     console.log(result.summary());
     ```
-### During E2E Testing (recommended usage car visualisation des noeuds)
+### During E2E Testing (recommended usage because it allows DOM nodes to be visualized)
 1. add `@uuv/cypress` npm dependency :
     ```shell
     npm install --save-dev @uuv/cypress
     ```
-2. create the file `uuv/e2e/a11y.feature` in the project root with the following content and replace url `https://e2e-test-quest.github.io/simple-webapp/a11y-test.html` by yours :
-    ```gherkin
-    Feature: A11y
-  
-    Scenario: Default RGAA
-      When I visit path "https://e2e-test-quest.github.io/simple-webapp/a11y-test.html"
-      Then I should not have any rgaa accessibility issue
-    
-    Scenario: RGAA with result
-      When I visit path "https://e2e-test-quest.github.io/simple-webapp/a11y-test.html"
-      Then I should have the following result based on the rgaa reference
-      """json
-        {
-          "status": "error",
-          "criteria": {
-            "1.1": {
-              "status": "error"
-            },
-            "1.2": {
-              "status": "error"
-            },
-            "1.3": {
-              "status": "manual"
-            },
-            "1.4": {
-              "status": "manual"
-            },
-            "1.5": {
-              "status": "manual"
-            },
-            "1.6": {
-              "status": "success"
-            },
-            "2.1": {
-              "status": "error"
-            },
-            "8.1": {
-              "status": "error"
-            },
-            "8.3": {
-              "status": "success"
-            },
-            "8.4": {
-              "status": "manual"
-            },
-            "8.5": {
-              "status": "error"
-            },
-            "8.6": {
-              "status": "manual"
-            },
-            "8.10": {
-              "status": "error"
-            },
-            "11.1": {
-              "status": "success"
-            }
-          }
-        }
-      """
-    ```
+   2. create the file `uuv/e2e/a11y.feature` in the project root with the following content and replace url `https://e2e-test-quest.github.io/simple-webapp/a11y-test.html` by yours :
+       ```gherkin
+       Feature: A11y validation
+          
+          Scenario: Default RGAA
+            When I visit path "https://e2e-test-quest.github.io/simple-webapp/a11y-test.html"
+            Then I should not have any rgaa accessibility issue
+      
+          Scenario: RGAA with partial result
+            When I visit path "https://e2e-test-quest.github.io/simple-webapp/a11y-test.html"
+            Then I should have the following partial result based on the rgaa reference
+               """json
+               {
+                  "status": "error",
+                  "criteria": {
+                     "1.5": {
+                        "status": "manual"
+                     },
+                     "1.6": {
+                        "status": "manual",
+                        "tests": {
+                           "1.6.5": {
+                              "status": "success"
+                           }
+                        }
+                     },
+                     "11.1": {
+                        "status": "success",
+                        "tests": {
+                           "11.1.1": {
+                              "status": "success"
+                           }
+                        }
+                     }
+                  }
+               }
+               """
+          ```
+   You can also see the [French example](https://github.com/Orange-OpenSource/uuv/blob/main/example/fr-rgaa.feature) or the complete [English example](https://github.com/Orange-OpenSource/uuv/blob/main/example/en-rgaa.feature).
 3. Then execute your tests :
     ```shell
     npx uuv e2e
     ```
 
+## Want to contribute ?
+Your help is welcome, see the [Contributors guide](https://github.com/Orange-OpenSource/uuv/blob/main/packages/a11y/CONTRIBUTING.md).
 
 ## License
 

package/STRUCTURE.md

@@ -0,0 +1,10 @@
+# Structure of the source
+
+The a11y sources are mainly located in the `packages/a11y/src/lib` directory :
+
+| Directory   | Description                                                                                                                                                                                                                                         |
+|-------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| `engine`    | Represents execution engine                                                                                                                                                                                                                         |
+| `model`     | Contains classes and interfaces to describe rules and results                                                                                                                                                                                       |
+| `query`     | A query is a component used to retrieve dom elements according to certain criteria.<br> Exemple : <br> - `by-role.query` : retrieve dom nodes based on their accessible role<br> - `by-tag.query` : retrieve dom nodes based on their html tag name |
+| `reference` | Contains declarations of accessibility standards supported by the `@uuv/a11y` solution, in particular RGAA                                                                                                                                          |