From 693dbf3d9f3746f09ae2686fb4fe5d83da00eea9 Mon Sep 17 00:00:00 2001
From: Charchit Kapoor <44813851+Being-Maverick@users.noreply.github.com>
Date: Fri, 13 Nov 2020 04:21:42 +0530
Subject: [PATCH] Checks added for attributes in label and input element (#43)

Co-authored-by: Jack Domleo <43371432+jackdomleo7@users.noreply.github.com>
---
 checka11y.css   | 36 ++++++++++++++++++++++++++++++++++++
 package.json    |  3 ++-
 test/index.html | 11 +++++++++++
 3 files changed, 49 insertions(+), 1 deletion(-)

diff --git a/checka11y.css b/checka11y.css
index 8f4727a..6160ec1 100644
--- a/checka11y.css
+++ b/checka11y.css
@@ -172,3 +172,39 @@ u::after {
   content: "WARNING: Using <u> -moz-element could be confused as a hyperlink, consider using a different -moz-element such as <em> or <b>." !important;
   content: "WARNING: Using <u> element could be confused as a hyperlink, consider using a different element such as <em> or <b>." !important;
 }
+
+label:not([for]){
+  border: var(--checka11y-error-border-width, 5px) solid var(--checka11y-error-color, red) !important;
+}
+
+label:not([for])::after{
+  content: "ERROR: Ensure that <label> is always provided with a [for] attribute" !important;
+  font-family: var(--checka11y-font, cursive);
+}
+
+label[for=""]{
+  border: var(--checka11y-error-border-width, 5px) solid var(--checka11y-error-color, red) !important;
+}
+
+label[for=""]::after{
+  content: "ERROR: Ensure that [for] in a <label> is not empty" !important;
+  font-family: var(--checka11y-font, cursive);
+}
+
+input:not([name])::after{
+  border: var(--checka11y-error-border-width, 5px) solid var(--checka11y-error-color, red) !important;
+}
+
+input:not([name])::after{
+  content: "ERROR: Ensure that <input> is always provided with a [name] attribute" !important;
+  font-family: var(--checka11y-font, cursive);
+}
+
+input[name=""]::after{
+  border: var(--checka11y-error-border-width, 5px) solid var(--checka11y-error-color, red) !important;
+}
+
+input[name=""]::after{
+  content: "ERROR: Ensure that [name] in a <input> is not empty" !important;
+  font-family: var(--checka11y-font, cursive);
+}
diff --git a/package.json b/package.json
index 665269a..3909da6 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,8 @@
     "Manaswini Munuguri (https://github.com/Manaswini1832)",
     "Shona McKenzie (https://github.com/shonamckenzie)",
     "Ashar Setiawan (https://github.com/azhsetiawan)",
-    "Bogdan Lazar (https://github.com/tricinel)"
+    "Bogdan Lazar (https://github.com/tricinel)",
+    "Charchit Kapoor <rakshak.kapoor1997@gmail.com> (https://github.com/Being-Maverick)"
   ],
   "keywords": [
     "checka11y",
diff --git a/test/index.html b/test/index.html
index d80938e..fa620df 100644
--- a/test/index.html
+++ b/test/index.html
@@ -312,5 +312,16 @@ <h2>Avoide using mouse event handlers without the appropriate keyboard alternati
         <div onclick="" onkeydown="" role="button" tabindex="-1">A div with onclick, onkeydown, role=button and tabindex=-1</div>
       </div>
     </section>
+    <section>
+      <label for="for">This is a label with a for attribute</label>
+      <hr/>
+      <label></label>
+      <hr/>
+      <label for=""></label>
+    </section>
+    <section>
+      <h2>Description: &lt;input&gt; should always be provided a non-empty name attribute</h2>
+      <input name="input-1" type="button" value="Button"/>
+    </section>
   </body>
 </html>