Prettier Formatting and linting fixes

.cspell.json

@@ -18,6 +18,6 @@
   ],
   "language": "en,en-US",
   "allowCompoundWords": true,
-  "ignorePaths": [".cspell.json", "**/node_modules/**", "*.min.*", "**/scss/**"],
+  "ignorePaths": [".cspell.json", "**/node_modules/**", "*.min.*"],
   "useGitignore": true
 }

.markdownlint.json

@@ -0,0 +1,5 @@
+{
+  "MD013": false,
+  "MD033": false,
+  "MD041": false
+}

.prettierrc.json

@@ -1,5 +1,6 @@
 {
   "bracketSameLine": true,
   "bracketSpacing": false,
+  "embeddedLanguageFormatting": "off",
   "printWidth": 120
 }

README.md

@@ -46,42 +46,42 @@ To enhance the maintainability and readability of your HTML, you can split the `
 
 ```html
 <script nomodule>
-    window.MSInputMethodContext && document.documentMode &&
-        document.write(
-            '<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-ie11@5.3.3/css/bootstrap-ie11.min.css">'
-            + '<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"><\/script>'
-            + '<script src="https://cdn.jsdelivr.net/npm/ie11-custom-properties@4"><\/script>'
-            + '<script src="https://cdn.jsdelivr.net/npm/element-qsa-scope@1"><\/script>'
-            + '<script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes"><\/script>'
-        );
+  window.MSInputMethodContext && document.documentMode &&
+    document.write(
+      '<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-ie11@5.3.3/css/bootstrap-ie11.min.css">'
+      + '<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"><\/script>'
+      + '<script src="https://cdn.jsdelivr.net/npm/ie11-custom-properties@4.1.0"><\/script>'
+      + '<script src="https://cdn.jsdelivr.net/npm/element-qsa-scope@1.1.0"><\/script>'
+      + '<script crossorigin="anonymous" src="https://polyfill-fastly.io/v3/polyfill.min.js?features=default%2CNumber.parseInt%2CNumber.parseFloat%2CArray.prototype.find%2CArray.prototype.includes"><\/script>'
+    );
 </script>
 ```
 
 ### Getting local copies of dependencies
 
 For environments where you need local copies of the dependencies, follow these steps to download and reference them locally:
 
-* [Bootstrap CSS](https://github.com/twbs/bootstrap/tree/v5.0.0-beta2/dist/css) - download the .css and corresponding .map files
-* [Bootstrap JS](https://github.com/twbs/bootstrap/tree/v5.0.0-beta2/dist/js) - download the .js and corresponding .map files
-* [IE11 Custom Properties](https://github.com/nuxodin/ie11CustomProperties/blob/master/ie11CustomProperties.js)
-* [Element QSA Scope](https://github.com/jonathantneal/element-qsa-scope/blob/master/index.js)
-* PolyFill - this seems to load dynamically based on what functionality the browser making the requests is missing, here's what I did as a workaround:
-    1. Open IE11 or Edge in IE11 mode (search "IE mode" in Edge settings to find and enable)
-    2. Copy/paste the URI in the `src` attribute of the `<script>` tag into the browser's URI bar and hit enter, the response will be whatever your app would receive
-    3. Copy/paste the text on the page and save it to a new file, now you have a local copy
+- [Bootstrap CSS](https://github.com/twbs/bootstrap/tree/v5.0.0-beta2/dist/css) - download the .css and corresponding .map files
+- [Bootstrap JS](https://github.com/twbs/bootstrap/tree/v5.0.0-beta2/dist/js) - download the .js and corresponding .map files
+- [IE11 Custom Properties](https://github.com/nuxodin/ie11CustomProperties/blob/master/ie11CustomProperties.js)
+- [Element QSA Scope](https://github.com/jonathantneal/element-qsa-scope/blob/master/index.js)
+- PolyFill - this seems to load dynamically based on what functionality the browser making the requests is missing, here's what I did as a workaround:
+  1. Open IE11 or Edge in IE11 mode (search "IE mode" in Edge settings to find and enable)
+  2. Copy/paste the URI in the `src` attribute of the `<script>` tag into the browser's URI bar and hit enter, the response will be whatever your app would receive
+  3. Copy/paste the text on the page and save it to a new file, now you have a local copy
 
 After downloading the dependencies, update your script to reference these local files:
 
 ```html
 <script nomodule>
-    window.MSInputMethodContext && document.documentMode &&
-        document.write(
-            '<link rel="stylesheet" href="css/bootstrap-ie11.min.css">'
-            + '<script src="js/bootstrap.bundle.min.js"><\/script>'
-            + '<script src="js/ie11CustomProperties.js"><\/script>'
-            + '<script src="js/elementQsaScope.js"><\/script>'
-            + '<script src="js/polyfill.js"><\/script>'
-        );
+  window.MSInputMethodContext && document.documentMode &&
+    document.write(
+      '<link rel="stylesheet" href="css/bootstrap-ie11.min.css">'
+      + '<script src="js/bootstrap.bundle.min.js"><\/script>'
+      + '<script src="js/ie11CustomProperties.js"><\/script>'
+      + '<script src="js/elementQsaScope.js"><\/script>'
+      + '<script src="js/polyfill.js"><\/script>'
+    );
 </script>
 ```
 

package.json

@@ -38,7 +38,9 @@
     "css-lint": "stylelint \"scss/*.scss\" --fix -f verbose",
     "css-minify": "cleancss --format breakWith=lf --source-map --source-map-inline-sources --output css/bootstrap-ie11.min.css css/bootstrap-ie11.css",
     "html-lint": "npx htmlhint \"tests/*.html\"",
-    "prettier": "npx prettier --write \"**/*.{json,scss,yml}\"",
+    "pa11y": "npx pa11y https://coliff.github.io/bootstrap-ie11/tests/",
+    "prettier": "npx prettier --write \"**/*.{json,md,scss,yml}\"",
+    "spellcheck": "npx cspell \"**/*.*\" --no-progress",
     "test": "npm run css-lint"
   },
   "config": {

tests/index.html

@@ -1345,7 +1345,7 @@ <h3 class="pt-3">Navbar</h3>
           </ul>
           <form class="d-flex">
             <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
-            <button class="btn btn-outline-success" type="button">Search</button>
+            <button class="btn btn-outline-success" type="submit">Search</button>
           </form>
         </div>
       </div>
@@ -2480,7 +2480,7 @@ <h5 class="pt-4">Horizontal</h5>
     <h5 class="pt-4">Horizontal with Vertical rule</h5>
 
     <div class="hstack gap-3">
-      <input class="form-control" type="text" placeholder="Add your item here...">
+      <input class="form-control" type="text" placeholder="Add your item here..." aria-label="Add your item here">
       <button type="button" class="btn btn-secondary">Submit</button>
       <div class="vr"></div>
       <button type="button" class="btn btn-outline-danger">Reset</button>