mate-academy · bohdanmayor · Apr 25, 2023 · Apr 25, 2023 · Apr 25, 2023 · Apr 25, 2023
diff --git a/dist/index.html b/dist/index.html
@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>HTML Form</title><link rel="stylesheet" href="style.1038547e.css"></head><body> <script type="text/javascript" src="main.5883b77c.js"></script> <form class="registerForm" action="https://mate-academy-form-lesson.herokuapp.com/create-application" method="post"> <fieldset class="fieldset"> <legend>Personal information</legend> <div class="field"> <label for="surname"> Surname: <input type="text" autocomplete="off" name="surname" id="surname"> </label> </div> <div class="field"> <label for="name"> Name: <input type="text" autocomplete="off" name="name" id="name"> </label> </div> <div class="field"> <label for="old"> How old are You? <input type="number" id="old" name="old" value="12" min="1" max="100"> </label> </div> <div class="field"> <label for="date"> Full date of birth: <input type="date" id="date" name="birth-date" placeholder="dd.mm.yyyy" min="1900-01-01" max="2023-04-30"> </label> </div> <div class="field"> <label for="accept-term"> I accept the term of the agreement <input type="checkbox" id="accept-term"> </label> </div> </fieldset> <fieldset class="fieldset"> <legend>Registration</legend> <div class="field"> <label for="user-email"> E-mail: <input type="email" id="user-email" placeholder="[email protected]"> </label> </div> <div class="field"> <label for="user-password"> Password: <input type="password" id="user-password" minlength="6"> </label> </div> </fieldset> <fieldset class="fieldset"> <legend>An interesting fact about you!</legend> <div class="field"> <label for="yes"> Do you love cats? <input type="radio" id="yes" name="love-cats" value="yes"> </label> <label for="yes">Yes</label> <input type="radio" id="no" name="love-cats" value="No"> <label for="no">No</label> </div> <div class="field"> <label for="color"> What is your favorite color? <input type="color" id="color"> </label> </div> <div class="field"> <label for="time"> What time do you go to bed? <input type="time" id="time" step="1"> </label> </div> <div class="field"> <label for="carBrand"> What are your favorite brand of cars? <select name="carBrand" id="carBrand" required multiple> <option value="bmw">BMW</option> <option value="audi">Audi</option> <option value="lada">Lada</option> <option disabled></option> </select> </label> </div> <div class="field"> <label for="workRate"> How do you rate our work? <input type="range" id="workRate"> </label> </div> </fieldset> <fieldset class="fieldset"> <legend>Additional info:</legend> <label class="field" for="comments"> Comments: <textarea id="comments"></textarea> </label> <div class="field"> <label> Would you recommend us? <select name="recommend" id="recommend"> <option value="yes">yes</option> <option value="no">no</option> </select> </label> </div> </fieldset> <button type="submit">Submit</button> </form> </body></html>
diff --git a/dist/main.5883b77c.js b/dist/main.5883b77c.js
diff --git a/dist/main.5883b77c.js.map b/dist/main.5883b77c.js.map
diff --git a/dist/report/bitmaps_reference/Email_with_placeholder-0.png b/dist/report/bitmaps_reference/Email_with_placeholder-0.png
diff --git a/dist/report/bitmaps_reference/Entire_document-0.png b/dist/report/bitmaps_reference/Entire_document-0.png
diff --git a/dist/report/bitmaps_reference/Fieldset_tag-0.png b/dist/report/bitmaps_reference/Fieldset_tag-0.png
diff --git a/dist/report/bitmaps_reference/Fieldset_tag-1.png b/dist/report/bitmaps_reference/Fieldset_tag-1.png
diff --git a/dist/report/bitmaps_reference/Fieldset_tag-2.png b/dist/report/bitmaps_reference/Fieldset_tag-2.png
diff --git a/dist/report/bitmaps_reference/Fieldset_tag-3.png b/dist/report/bitmaps_reference/Fieldset_tag-3.png
diff --git a/dist/report/bitmaps_reference/Form-0.png b/dist/report/bitmaps_reference/Form-0.png
diff --git a/dist/report/bitmaps_reference/Number_with_value-0.png b/dist/report/bitmaps_reference/Number_with_value-0.png
diff --git a/dist/report/bitmaps_reference/Submit_button-0.png b/dist/report/bitmaps_reference/Submit_button-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Email_with_placeholder-0.png b/dist/report/bitmaps_test/20230425-192445/Email_with_placeholder-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Entire_document-0.png b/dist/report/bitmaps_test/20230425-192445/Entire_document-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-0.png b/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-1.png b/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-1.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-2.png b/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-2.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-3.png b/dist/report/bitmaps_test/20230425-192445/Fieldset_tag-3.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Form-0.png b/dist/report/bitmaps_test/20230425-192445/Form-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Number_with_value-0.png b/dist/report/bitmaps_test/20230425-192445/Number_with_value-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/Submit_button-0.png b/dist/report/bitmaps_test/20230425-192445/Submit_button-0.png
diff --git a/dist/report/bitmaps_test/20230425-192445/report.json b/dist/report/bitmaps_test/20230425-192445/report.json
@@ -0,0 +1,225 @@
+{
+  "testSuite": "BackstopJS",
+  "tests": [
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Entire_document-0.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Entire_document-0.png",
+        "selector": "document",
+        "fileName": "Entire_document-0.png",
+        "label": "Entire document",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.07",
+          "analysisTime": 23
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Form-0.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Form-0.png",
+        "selector": "form",
+        "fileName": "Form-0.png",
+        "label": "Form",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.07",
+          "analysisTime": 21
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Fieldset_tag-0.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Fieldset_tag-0.png",
+        "selector": "fieldset",
+        "fileName": "Fieldset_tag-0.png",
+        "label": "Fieldset tag",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.04",
+          "analysisTime": 11
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Fieldset_tag-1.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Fieldset_tag-1.png",
+        "selector": "fieldset.__n1",
+        "fileName": "Fieldset_tag-1.png",
+        "label": "Fieldset tag",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.00"
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Fieldset_tag-2.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Fieldset_tag-2.png",
+        "selector": "fieldset.__n2",
+        "fileName": "Fieldset_tag-2.png",
+        "label": "Fieldset tag",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.18",
+          "analysisTime": 15
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Fieldset_tag-3.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Fieldset_tag-3.png",
+        "selector": "fieldset.__n3",
+        "fileName": "Fieldset_tag-3.png",
+        "label": "Fieldset tag",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.00"
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Submit_button-0.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Submit_button-0.png",
+        "selector": "[type=\"submit\"]",
+        "fileName": "Submit_button-0.png",
+        "label": "Submit button",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.00"
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Email_with_placeholder-0.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Email_with_placeholder-0.png",
+        "selector": "[type=\"email\"][placeholder]",
+        "fileName": "Email_with_placeholder-0.png",
+        "label": "Email with placeholder",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.00"
+        }
+      },
+      "status": "pass"
+    },
+    {
+      "pair": {
+        "reference": "..\\bitmaps_reference\\Number_with_value-0.png",
+        "test": "..\\bitmaps_test\\20230425-192445\\Number_with_value-0.png",
+        "selector": "[type=\"number\"][value]",
+        "fileName": "Number_with_value-0.png",
+        "label": "Number with value",
+        "requireSameDimensions": false,
+        "misMatchThreshold": 1,
+        "url": "http://localhost:3001/index.html",
+        "referenceUrl": "https://mate-academy.github.io/layout_solutions/html-form/",
+        "expect": 0,
+        "viewportLabel": "tablet_h",
+        "diff": {
+          "isSameDimensions": true,
+          "dimensionDifference": {
+            "width": 0,
+            "height": 0
+          },
+          "misMatchPercentage": "0.00"
+        }
+      },
+      "status": "pass"
+    }
+  ]
+}
diff --git a/dist/report/html_report/a96f14595379b7c348d66e115ec65a93.png b/dist/report/html_report/a96f14595379b7c348d66e115ec65a93.png
diff --git a/dist/report/html_report/assets/fonts/Lato-Bold.ttf b/dist/report/html_report/assets/fonts/Lato-Bold.ttf
diff --git a/dist/report/html_report/assets/fonts/Lato-Regular.ttf b/dist/report/html_report/assets/fonts/Lato-Regular.ttf
diff --git a/dist/report/html_report/assets/fonts/lato-bold-webfont.woff b/dist/report/html_report/assets/fonts/lato-bold-webfont.woff
diff --git a/dist/report/html_report/assets/fonts/lato-bold-webfont.woff2 b/dist/report/html_report/assets/fonts/lato-bold-webfont.woff2
diff --git a/dist/report/html_report/assets/fonts/lato-regular-webfont.woff b/dist/report/html_report/assets/fonts/lato-regular-webfont.woff
diff --git a/dist/report/html_report/assets/fonts/lato-regular-webfont.woff2 b/dist/report/html_report/assets/fonts/lato-regular-webfont.woff2
diff --git a/dist/report/html_report/b815e28b1e230cff6e9d7b749edcd562.png b/dist/report/html_report/b815e28b1e230cff6e9d7b749edcd562.png
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>HTML Form</title><link rel="stylesheet" href="style.1038547e.css"></head><body> <script type="text/javascript" src="main.5883b77c.js"></script> <form class="registerForm" action="https://mate-academy-form-lesson.herokuapp.com/create-application" method="post"> <fieldset class="fieldset"> <legend>Personal information</legend> <div class="field"> <label for="surname"> Surname: <input type="text" autocomplete="off" name="surname" id="surname"> </label> </div> <div class="field"> <label for="name"> Name: <input type="text" autocomplete="off" name="name" id="name"> </label> </div> <div class="field"> <label for="old"> How old are You? <input type="number" id="old" name="old" value="12" min="1" max="100"> </label> </div> <div class="field"> <label for="date"> Full date of birth: <input type="date" id="date" name="birth-date" placeholder="dd.mm.yyyy" min="1900-01-01" max="2023-04-30"> </label> </div> <div class="field"> <label for="accept-term"> I accept the term of the agreement <input type="checkbox" id="accept-term"> </label> </div> </fieldset> <fieldset class="fieldset"> <legend>Registration</legend> <div class="field"> <label for="user-email"> E-mail: <input type="email" id="user-email" placeholder="[email protected]"> </label> </div> <div class="field"> <label for="user-password"> Password: <input type="password" id="user-password" minlength="6"> </label> </div> </fieldset> <fieldset class="fieldset"> <legend>An interesting fact about you!</legend> <div class="field"> <label for="yes"> Do you love cats? <input type="radio" id="yes" name="love-cats" value="yes"> </label> <label for="yes">Yes</label> <input type="radio" id="no" name="love-cats" value="No"> <label for="no">No</label> </div> <div class="field"> <label for="color"> What is your favorite color? <input type="color" id="color"> </label> </div> <div class="field"> <label for="time"> What time do you go to bed? <input type="time" id="time" step="1"> </label> </div> <div class="field"> <label for="carBrand"> What are your favorite brand of cars? <select name="carBrand" id="carBrand" required multiple> <option value="bmw">BMW</option> <option value="audi">Audi</option> <option value="lada">Lada</option> <option disabled></option> </select> </label> </div> <div class="field"> <label for="workRate"> How do you rate our work? <input type="range" id="workRate"> </label> </div> </fieldset> <fieldset class="fieldset"> <legend>Additional info:</legend> <label class="field" for="comments"> Comments: <textarea id="comments"></textarea> </label> <div class="field"> <label> Would you recommend us? <select name="recommend" id="recommend"> <option value="yes">yes</option> <option value="no">no</option> </select> </label> </div> </fieldset> <button type="submit">Submit</button> </form> </body></html>