forked from Section508Coordinators/ACRT
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathHelp_Input.html
164 lines (158 loc) · 10.1 KB
/
Help_Input.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="./CSS/acrt_styles.css">
<title>ACRT Create Form Help </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no" />
<meta name="description" content="Great Tool to track test results" />
</head>
<body>
<div class="topnav" id="myTopnav">
<a title="Home" href="index.html" id="aboutID">Home </a>
<a title="Instructions" href="./Help.html" target="_blank" id="helpID">Instructions </a>
<a title="Create/Edit Report" href="./ACRT_Web_Input_Form.html" id="crtReportID" >Create/Edit Report </a>
<a title="View Report" href="./ACRT_View_webReport.html" id="vwRptId" >View Report</a>
<a title="License License" href= "./Resources/LICENSE.html" target="_blank" id="licenseID"> View License </a>
</div>
<article class="text">
<h2><strong>Topic 2:</strong> How to Create a New Test Results Form</h2>
<p><strong>Tool Tips: </strong></p>
<ul>
<li>Required fields must be completed before you can save the form.</li>
<li>Unsaved data will be lost if you refresh your screen or close the file without saving it.</li>
<li>Each time files are saved, you have the option to save to computer’s Downloads folder or specified location of choice.</li>
<li>JSON files default to Product name and Product Version for saved files.</li>
<li>Expand collapsed sections to reveal data fields for Product, Test Environment, and Test Information in to input information.</li>
<li>You can create your own customized input JSON file. You may want to do so in order to pre-populate some data fields, e.g. your tester information.</li>
</ul>
<h3>Instructions to Create a New Test Results Form</h3>
<ol>
<li>Open the Index.html file from ACRT folder created in your file location.</li>
<li>From the ACRT Home page, select <strong>Create Report</strong> from the top navigation menu.</li>
</ol>
<p><img src=".\Images\CreateReport.JPG" alt="CreateReport Page" width="100%" height="500"> <strong><em>Figure 4: Navigation for ACRT Create Report Link</em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="3">
<li>The <strong>Create New Test Results Form </strong>page will open.</li>
</ol>
<p> <img src=".\Images\CreateReportView.JPG" alt="CreateReport Page" width="100%" height="500"> <strong><em>Figure 5: Create Report Page View</em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="4">
<li>Select the Input file location using one of the following options.
<ol>
<li>Select the SuccessCriteria.json file located in ACRT folder > Resources folder.</li>
</ol>
</li>
</ol>
<p> <img src=".\Images\SuccessCriteria.JPG" alt="successcriteria.json location" width="600" height="500"> <strong><em><br>Figure 6: Resource folder highlighted to identify location of sucesscriteria.json file</em></strong></p>
<p><strong><em> </em></strong></p>
<ol>
<li>Navigate to the custom location you created for the json file.</li>
</ol>
<ol start="5">
<li>Open the SuccessCriteria.JSON template file (or your custom file) by selecting the <strong>Choose File </strong></li>
</ol>
<p><img src=".\Images\ChooseFile.JPG" alt="Choose File" width="600" height="500"><br><strong><em>Figure 7: Choose File button highlighted on the Create Report Page</em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="6">
<li>Select the <strong>Load Template </strong>button to load the template and create a new test results form.
<ol>
<li>A new <strong>Generate test results form</strong> table is displayed below.</li>
<li>A notification will display at the bottom of the page with the message “Upon saving, the file will be located in the system's Downloads folder by default” is displayed.</li>
</ol>
</li>
</ol>
<p><img src=".\Images\Save.JPG" alt="Save" width="600" ><br><strong><em>Figure 8: Save button notification</em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="7">
<li>At the top of the page, you have the option to select <strong><em> Disable common alerts</strong></em>. The types of alerts that can be disabled include:
<p><img src=".\Images\alert.JPG" alt="Save" width="600" ><br><strong><em>Figure 9: Disable common alerts checkbox – Create Report</em></strong></p> <li>
</ol>
<ol start="8">
<li>Provide details about the product. Some fields are mandatory as indicated by a red asterisk.
<ol>
<li>Select the Product section to <strong>expand </strong>the form fields.</li>
<li>Complete all required fields: Name of Product, Product Version, and Product Description.</li>
<li>Complete other fields as desired.</li>
</ol>
</li>
</ol>
<p><img src=".\Images\ProductSection.JPG" alt="Product Section" width="600" height="500"><br> <strong><em>Figure 10: Product Section </em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="9">
<li>Provide details about the test environment. Form fields in this section <strong>are not</strong>
<ol>
<li>Select the Test Environment section to expand the form fields.</li>
<li>Complete fields to describe the default browser and operating system used when performing testing.</li>
</ol>
</li>
</ol>
<p> <img src=".\Images\TestEnvironment.JPG" alt="Test Environment" width="600" height="500"><br><strong><em>Figure 11: Test Environment Section </em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="10">
<li>Provide details about the tester information. Some fields are mandatory as indicated by a red asterisk.
<ol>
<li>Select the Testing Information section to <strong>expand</strong> the form fields.</li>
<li>Complete all required fields.</li>
<li>Complete other fields as desired. Note: Trusted Testers are encouraged to provide their certification number in order to authenticate the results.</li>
</ol>
</li>
</ol>
<p> <img src=".\Images\TestingInformation.JPG" alt="TestingInformation" width="600" height="500"><br><strong><em>Figure 12: Testing Information Section </em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="11">
<li>Once you have completed all required fields about the product, you have the option to:
<ol>
<li>Save the file with the entered data as a custom template file for later use, in order to load a pre-populated version of the template, or</li>
<li>Continue to the next section <strong>Generate test results form</strong> to enter testing data and create a report.</li>
</ol>
</li>
</ol>
<h2><strong>Topic 3:</strong> How to Create Report</h2>
<p><strong>Tool Tips: </strong></p>
<ul>
<li>You can begin entering test results once you have completed the steps to create a new test form.</li>
<li>You must complete all required fields, including those in the Product and Testing Information sections to save test results.</li>
<li>On the <strong>Create New Report</strong> <strong>Form</strong> page, you can repeatedly save partially completed testing information during the current session, until you reload or close the page in your browser. You can use <strong>Edit Report</strong> later to continue entering testing information.</li>
<li>Each input form field has a <strong>500 character limit </strong>for<strong> Tester’s Comment </strong>for failed test conditions. Once you reach the character limit, no more characters can be entered.</li>
<li>Comments will display in the ‘Remark & Explanation’ section of the <strong>View Report</strong></li>
<li>Each time you save results, a new JSON file is created.</li>
<li>If all tests are completed in <strong>Create Report</strong> page, you can view your report in <strong>View Report </strong> Use <strong>Edit Report </strong>page only to update or add Remediation details.</li>
</ul>
<ul>
<li>Recommended image types for ACRT to attach screen shots are PNG and GIF.</li>
</ul>
<ul>
<li>See <strong>“Edit Report” instructions</strong> for editing an existing saved file.</li>
</ul>
<p> </p>
<p><strong> </strong></p>
<h3>Instructions to Create Report</h3>
<ol>
<li>Following the previous <strong>Instructions to Create a New Test Form,</strong> ensure you have loaded the SuccessCriteria.json or custom template file and have completed all the required/mandatory information for the Product, Test Environment, and Testing Information.</li>
<li>The <strong>Generate test results form </strong>table is displayed. Note: The table is not visible until the template file is loaded.</li>
<li>Input the test results into the form.</li>
</ol>
<p> <img src=".\Images\GenerateTestResult.JPG" alt="GenerateTestResult table" width="100%" height="500"><br> <strong><em>Figure 13: Generate Test Results form </em></strong></p>
<p><strong><em> </em></strong></p>
<ol start="4">
<li>To save a screenshot of a failure in the screenshot column, use the file selection button to browse to the image stored on your local machine. Only one image may be saved in each cell. If another image is needed, select <strong>Add Issue</strong> for an additional failure. The new <strong>Child Issue</strong> will be added at the <strong>end</strong> of the table.</li>
</ol>
<ol>
<ol>
<li>Image types that support ACRT include: Joint Photographic Experts Group (JPEG or JPG), Portable Network Graphic (PNG), Graphic Exchange Format (GIF), and Windows Bitmap (BMP). Note: PNG and GIF image types are recommended.</li>
</ol>
</ol>
<p> <img src=".\Images\AddIssue.JPG" alt="AddIssue" width="100%" height="500"><br> <strong><em>Figure 14: Generate Test Results Form Issue Number column highlight to add issue</em></strong></p>
<ol start="5">
<li>Once test results are added, select the <strong>Save</strong> button at the bottom of page to capture the input data as an JSON file on your local machine. Note: The file will be saved to the system's Downloads folder by default. You can also store JSON file at your own repository or send it to the DHS employee for reporting and analytical purpose to generate business value.</li>
</ol>
<p><img src=".\Images\JSONInput.JPG" alt="JSONInput" width="600"><br><strong><em>Figure 15: JSON file output generated</em></strong></p>
</article>
<br> <br>
<div class="footer">
<p>Accessibility Conformance Report Tool (ACRT) Help Page </p>
</div>
</body>
</html>