Skip to content

Commit

Permalink
[#11878] Add snapshot tests for instructor request form UI (#12942)
Browse files Browse the repository at this point in the history 
* Add snapshot tests

* Change double quotes to single quotes
  • Loading branch information
@xenosf
xenosf authored Mar 28, 2024
1 parent 0aa7dfb commit f6329eb
Show file tree
Hide file tree
Showing 4 changed files with 421 additions and 0 deletions.
181 changes: 181 additions & 0 deletions src/web/app/pages-static/request-page/__snapshots__/request-page.component.spec.ts.snap
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,181 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`RequestPageComponent should render correctly after form is submitted 1`] = `
<tm-request-page
accountRequestFormUrl="null"
isDeclarationDone="false"
sanitizer={[Function _DomSanitizerImpl]}
submittedFormData={[Function Object]}
>
<h1
class="color-orange"
>
Request for an Instructor Account
</h1><div
class="col-xs-12 col-md-10 col-lg-8 col-xl-7 col-xxl-6"
>
<div>
<p>
Your request has been submitted successfully:
</p>
<table
class="table table-bordered my-3"
>
<tbody>
<tr>
<th
class="col-3"
scope="row"
>
Full Name
</th>
<td>
Jane Smith
</td>
</tr>
<tr>
<th
scope="row"
>
Institution
</th>
<td>
University of Example
</td>
</tr>
<tr>
<th
scope="row"
>
Country
</th>
<td>
Example Republic
</td>
</tr>
<tr>
<th
scope="row"
>
Email
</th>
<td>
js@exampleu.edu
</td>
</tr>
<tr>
<th
scope="row"
>
Home Page URL
</th>
<td>
u.exampleu.edu/jsmith
</td>
</tr>
<tr>
<th
scope="row"
>
Comments
</th>
<td>
<span
class="empty-field-placeholder"
/>
</td>
</tr>
</tbody>
</table>
<p>
We have sent an acknowledgement email to your email address
<b>
js@exampleu.edu
</b>
. Please check your email inbox or spam folder. If you do not receive the acknowledgement email within 1 hour, please
<a
tmrouterlink="/web/front/contact"
>
contact
</a>
us.
</p>
</div>
</div>
</tm-request-page>
`;

exports[`RequestPageComponent should render correctly after instructor declaration is done 1`] = `
<tm-request-page
accountRequestFormUrl="null"
isDeclarationDone={[Function Boolean]}
sanitizer={[Function _DomSanitizerImpl]}
submittedFormData="null"
>
<h1
class="color-orange"
>
Request for an Instructor Account
</h1><div
class="col-xs-12 col-md-10 col-lg-8 col-xl-7 col-xxl-6"
>
<div>
<p>
Request for an instructor account using this form if you are an instructor and want to use TEAMMATES to manage peer evaluations and/or other feedback paths of your students.
</p>
<hr />
<div>
<tm-instructor-request-form />
</div>
<hr />
</div>
</div>
</tm-request-page>
`;

exports[`RequestPageComponent should render correctly before instructor declaration is done 1`] = `
<tm-request-page
accountRequestFormUrl="null"
isDeclarationDone="false"
sanitizer={[Function _DomSanitizerImpl]}
submittedFormData="null"
>
<h1
class="color-orange"
>
Request for an Instructor Account
</h1><div
class="col-xs-12 col-md-10 col-lg-8 col-xl-7 col-xxl-6"
>
<div>
<p>
Request for an instructor account using this form if you are an instructor and want to use TEAMMATES to manage peer evaluations and/or other feedback paths of your students.
</p>
<hr />
<div>
<p>
Note:
<b>
Students should not use this form to request for TEAMMATES accounts
</b>
, as students do not need accounts to use TEAMMATES. Instead, TEAMMATES will email students (who have been added to TEAMMATES by a course instructor) an access link when there is a TEAMMATES session available for them to access.
</p>
<a
class="btn btn-secondary"
tmrouterlink="/web/front/home"
type="button"
>
Back to home page
</a>
<button
class="btn btn-primary ms-3"
type="button"
>
I am an instructor
</button>
</div>
<hr />
</div>
</div>
</tm-request-page>
`;
209 changes: 209 additions & 0 deletions ...page/instructor-request-form/__snapshots__/instructor-request-form.component.spec.ts.snap
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,209 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`InstructorRequestFormComponent should render correctly 1`] = `
<tm-instructor-request-form
arf={[Function FormGroup]}
comments={[Function FormControl2]}
country={[Function FormControl2]}
email={[Function FormControl2]}
hasSubmitAttempt="false"
homePage={[Function FormControl2]}
institution={[Function FormControl2]}
name={[Function FormControl2]}
requestSubmissionEvent={[Function EventEmitter_]}
>
<p
aria-hidden="true"
>
Questions marked with an asterisk
<span
class="red-font"
>
*
</span>
are required.
</p><form
class="ng-untouched ng-pristine ng-invalid"
novalidate=""
>
<div
class="form-group required"
>
<label
class="qn"
for="name"
id="name-label"
>
Full Name
</label>
<p
class="help-block"
>
This is the name that will be shown to your students. You may include salutation (Dr. Prof. etc.)
</p>
<input
aria-invalid="true"
autocomplete="name"
class="form-control ng-untouched ng-pristine ng-invalid"
id="name"
required=""
type="text"
/>
<div
aria-describedby="name-label"
class="invalid-feedback"
role="alert"
tabindex="0"
>
Please enter your name.
</div>
</div>
<br />
<div
class="form-group required"
>
<label
class="qn"
for="institution"
id="institution-label"
>
University/school/institution
</label>
<p
class="help-block"
>
Please give full name of the university/institution.
</p>
<input
aria-invalid="true"
autocomplete="organization"
class="form-control ng-untouched ng-pristine ng-invalid"
id="institution"
required=""
type="text"
/>
<div
aria-describedby="institution-label"
class="invalid-feedback"
role="alert"
tabindex="0"
>
Please enter your institution.
</div>
</div>
<br />
<div
class="form-group required"
>
<label
class="qn"
for="country"
id="country-label"
>
Country
</label>
<p
class="help-block"
>
Which country is your university/institution based in?
</p>
<input
aria-invalid="true"
autocomplete="country-name"
class="form-control ng-untouched ng-pristine ng-invalid"
id="country"
required=""
type="text"
/>
<div
aria-describedby="country-label"
class="invalid-feedback"
role="alert"
tabindex="0"
>
Please enter your institution's country.
</div>
</div>
<br />
<div
class="form-group required"
>
<label
class="qn"
for="email"
id="email-label"
>
Official email address
</label>
<p
class="help-block"
>
Please use the email address
<b>
given to you by your school/university
</b>
(not your personal Gmail/Hotmail address). Note that this email address will be visible to the students you enroll in TEAMMATES.
</p>
<input
aria-invalid="true"
autocomplete="email"
class="form-control ng-untouched ng-pristine ng-invalid"
id="email"
required=""
type="email"
/>
<div
aria-describedby="email-label"
class="invalid-feedback"
role="alert"
tabindex="0"
>
Please enter a valid email address.
</div>
</div>
<br />
<div
class="form-group"
>
<label
class="qn"
for="homePage"
id="homePage-label"
>
URL of your home page (if any)
</label>
<input
aria-invalid="false"
autocomplete="url"
class="form-control ng-untouched ng-pristine ng-valid"
id="homePage"
type="url"
/>
</div>
<br />
<div
class="form-group"
>
<label
class="qn"
for="comments"
id="comments-label"
>
Any other comments/queries
</label>
<textarea
aria-invalid="false"
class="form-control ng-untouched ng-pristine ng-valid"
/>
</div>
<br />
<button
class="btn btn-primary"
id="submit-button"
type="submit"
>
Submit
</button>
</form>
</tm-instructor-request-form>
`;
Loading

0 comments on commit f6329eb

Please sign in to comment.