[Updates] Teacher registration flow

[mewtaylor]

Includes new styling for the flow.

/cc @rschamp @carljbowman

[mewtaylor]

@rschamp @carljbowman @thisandagain merging as is. @jwzimmer I will work on a test plan to add to the wiki tonight/tomorrow if that's okay!

[rschamp]

Thanks @mewtaylor! It looks great. I'm going to leave notes here to organize things for clean up.

[mewtaylor]

@rschamp @jwzimmer please feel free to adjust https://github.com/LLK/scratch-www/wiki/Testing-Scratch-www#All_Test_Cases_Teacher_Join_Flow as you see fit!

[jwzimmer-zz]

Testing teacher registration on Staging

Chrome

• Signed up "halloiamteachor"
• Validations for username/ password
  • I get a validation if I try to use a pre-existing username when signing up
  • I get a validation if I try to use my username as my password
  • I get a validation if I try to use my password as my username : )
  • I get a validation if I try to use password as my password
  • If I try to use spaces in my username I get a validation
  • I can use spaces in my password
  • If I use non-alphanumeric chars I get a validation (it is kind of confusing --> Teacher Registration: Confusing use of "characters" in username validation - excludes "?", "!" (non-alphanumeric characters) #684)
  • If I leave username or password blank I get a validation
  • Clicking "Next" doesn't let me move to the next step while I have an active validation
• Show password checkmark works
• Demographic info
• I can choose a year, including 1917, 1997, 2016
• I can choose a month, including January, December
• I can choose any gender (M, F, Other)
  • If I choose Other, I get "this field is required" if I don't fill in the text
• I can leave the country as the default (not touch it at all; US selected by default) and continue to the next step
• Phone Number & "consent"
• Phone number field should exist & be editable
  • It should be editable like other strings --> Teacher Registration - You can only insert one character at a time/ editing is strange in the phone number field #688
• Too long or too short phone numbers should not be accepted as valid
  • This mostly works, but an extra digit doesn't always trigger the too long validation, seemingly if the number is a US number starting with 11 --> Entered too-long phone number during Teacher Registration #691
• Next button should not work with an "invalid phone number" warning
• Phone number flag icon & country code should default to the country you chose in the demographic info step
• Phone number field should be required --> Phone number field not required but it should be - Teacher Registration #693
  • Flag should be correct flag --> Teacher Registration - Flag icons in phone number field not necessarily correct #689
  • Country code should be correct --> Teacher Registration - Area code for Vatican City not necessarily correct #690
  • Did not check every country code or flag
• You should be required to check the consent box or else you cannot move past this step (Next won't work)
  • Clicking Next without checking the box should bring up an explanation that you need to check it to create an account
• Using back/ forward arrows causes 403 error --> Teacher Registration - should users be able to use back & forward arrows/ navigate through steps (get 403 error)? #692
• After going through all the steps successfully, you should get to the waiting room
• Before you confirm your email, My Classes should redirect to waiting room
• After you confirm your email, My Classes should no longer redirect to waiting room
• After you confirm your email, if you go to the waiting room, the confirm email card will be gone

Issues:

• Teacher Registration - I don't see validations (e.g. for username already exists) until I click "Next" #683
• Teacher Registration: Confusing use of "characters" in username validation - excludes "?", "!" (non-alphanumeric characters) #684
• Teacher Registration - You can only insert one character at a time/ editing is strange in the phone number field #688
• Teacher Registration - Flag icons in phone number field not necessarily correct #689
  • Also opened an issue for this in the phone number tool's repository
• Teacher Registration - Area code for Vatican City not necessarily correct #690
• Entered too-long phone number during Teacher Registration #691
• Teacher Registration - should users be able to use back & forward arrows/ navigate through steps (get 403 error)? #692
• Phone number field not required but it should be - Teacher Registration #693
• Type of Organization should be required - Teacher Registration #695 --> we should require the Type of Organization field, re Type of Organization should be required - Teacher Registration #695 (comment)
• Floating field validation for Country - Teacher Registration #694
• Error at end of Teacher Registration #696
• Can't proceed to next step after email - Teacher Registration #697
• https://github.com/LLK/scratchr2/issues/3797

[jwzimmer-zz]

Testing teacher registration in IE 11

• I can make it all the way through registration in IE 11
• Some of the dropdowns have misaligned text --> Text in dropdowns is very left-aligned in IE11 - Teacher Registration #700
• Some of the validations are misaligned --> Misaligned validation for consent checkbox in IE 11 - Teacher Registration #699
• I am seeing the waiting room wait for approval card even though I can sign in and see My Classes (not getting redirected) --> Waiting for approval card appears at same time as I can access My Classes - Teacher Registration #698
  • Do I ever see the waiting room card in chrome? --> Waiting for approval card appears at same time as I can access My Classes - Teacher Registration #698
• Country dropdown automatically highlights & has border pixels misaligned --> Teacher Registration > Address > Country field automatically highlights when filled in; pixels in border are misaligned #701

[jwzimmer-zz]

Testing teacher registration in Safari

• I can make it all the way through registration in Safari

[jwzimmer-zz]

Post-deploy -
Chrome

• Type of Organization validation should be triggered at the same time as other validations on the same page - Teacher Registration #705
• Phone number field says "enter a valid phone number" rather than "this field is required" - Teacher Registration #706
• Error after trying to register for teacher account - on production #707
• I can get through registration

IE 11

• I can get through registration
• I see all the expected validations (I think; I didn't go through it super carefully but I think I hit all of them)
• I can't enter a description of more than 300 chars in the what-is-your-organization-going-to-do-with-scratch question