ലിങ്കുകൾ മാറിപ്പോകാതെ React-ൽ ഇമെയിൽ മാറ്റുന്ന പ്രക്രിയകൾ (flows) എങ്ങനെ ടെസ്റ്റ് ചെയ്യാം
ഒരു അക്കൗണ്ട് ഇമെയിൽ മാറ്റുന്നത് ചെറിയ കാര്യമായി തോന്നാം. എന്നാൽ യഥാർത്ഥത്തിൽ ടെസ്റ്റിംഗിൽ വലിയ പിശകുകൾ സംഭവിക്കാൻ ഇത് കാരണമാകാറുണ്ട്.
ടെസ്റ്റർമാർ പലപ്പോഴും കൺഫർമേഷൻ ലിങ്കുകൾ മാറിപ്പോകാറുണ്ട്. ഒരാൾ അഡ്രസ്സ് അപ്ഡേറ്റ് ചെയ്യുമ്പോൾ മറ്റൊരാൾ ആദ്യം മെസ്സേജ് തുറന്നാൽ ഇത് ആശയക്കുഴപ്പമുണ്ടാക്കും. React പേജ് തകരാറിലാണോ അതോ ലിങ്ക് തെറ്റായ യൂസറുടേതാണോ എന്ന് ടീമിനിടയിൽ തർക്കങ്ങൾ ഉണ്ടാകാൻ ഇത് കാരണമാകുന്നു.
ടീമുകൾ ഇൻബോക്സിനെ ഒരു പങ്കിട്ട ടൂൾ (shared tool) ആയി കാണുന്നത് കൊണ്ടാണ് ഈ പ്രശ്നം ഉണ്ടാകുന്നത്. ഇൻബോക്സിനെ ഫീച്ചറിന്റെ ഭാഗമായി തന്നെ കാണണം.
ഇമെയിൽ മാറ്റുന്ന പ്രക്രിയകൾ വളരെ സെൻസിറ്റീവ് ആണ്. അവ ഒരു ആക്ടീവ് അക്കൗണ്ടിൽ മാറ്റം വരുത്തുന്നു. യൂസർ ഇതിനകം തന്നെ ലോഗിൻ ചെയ്തിട്ടുണ്ടാകും. പെൻഡിംഗ് ഇമെയിൽ സ്റ്റേറ്റും കൺഫേം ചെയ്ത ഇമെയിൽ സ്റ്റേറ്റും തമ്മിൽ പലപ്പോഴും ഒരു മത്സരത്തിന് (race) സമാനമായ സാഹചര്യം ഉണ്ടാകാറുണ്ട്.
സാധാരണയായി ഉണ്ടാകുന്ന പ്രശ്നങ്ങൾ ഇവയാണ്:
- കൺഫർമേഷൻ മെസ്സേജുകൾ ട്രാക്ക് ചെയ്യാൻ കഴിയാത്ത രീതിയിൽ ഒരു ഷെയർഡ് ഇൻബോക്സിലേക്ക് വരുന്നു.
- ലിങ്ക് വഴി പുതിയ റിക്വസ്റ്റ് കൺഫേം ചെയ്ത ശേഷവും UI പഴയ ഡാറ്റ കാണിക്കുന്നു.
- ബാക്കെൻഡ് അപ്ഡേറ്റ് ആകുന്നുണ്ടെങ്കിലും ഫ്രണ്ട്എൻഡ് കാഷെ (cache) പഴയ അഡ്രസ്സ് തന്നെ കാണിക്കുന്നു.
- ഒരു ടെസ്റ്റർ മറ്റൊരു വ്യക്തിക്ക് വേണ്ടിയുള്ള ലിങ്കിൽ ക്ലിക്ക് ചെയ്യുന്നു.
ഒരു ഷെയർഡ് മെയിൽബോക്സ് ഉപയോഗിക്കുന്നത് ബഗ്ഗുകളുടെ കാരണം കണ്ടെത്തുന്നത് പ്രയാസകരമാക്കും. ഒരു സ്റ്റേജിംഗ് ഏലിയാസിന് (staging alias) പകരം ഓരോ ടെസ്റ്റ് റണ്ണിനും ഒരു പ്രത്യേക ബേണർ ഇമെയിൽ അഡ്രസ്സ് (unique burner email address) ഉപയോഗിക്കുക.
ഈ വ്യക്തമായ ക്രമം പിന്തുടരുക:
- ഒരു ടെസ്റ്റ് യൂസറെ ക്രിയേറ്റ് ചെയ്യുക.
- React സെറ്റിംഗ്സ് സ്ക്രീനിൽ ഇമെയിൽ മാറ്റാൻ റിക്വസ്റ്റ് ചെയ്യുക.
- യഥാർത്ഥ ബാക്കെൻഡ് പാത്ത് വഴി മെയിൽ അയക്കുക.
- ഈ ടെസ്റ്റിന് മാത്രമായിട്ടുള്ള ഒരു ഇൻബോക്സിലേക്ക് മെസ്സേജ് റൂട്ട് ചെയ്യുക.
- ലിങ്ക് തുറന്ന് സെറ്റിംഗ്സ് സ്ക്രീൻ പുതിയ അഡ്രസ്സുമായി റിഫ്രഷ് ആകുന്നുണ്ടോ എന്ന് പരിശോധിക്കുക.
ഇത് ഉടമസ്ഥാവകാശം (ownership) വ്യക്തമാക്കുന്നു. ഏത് ലിങ്ക് ഏത് യൂസറിൽ നിന്നാണ് വന്നതെന്ന് നിങ്ങൾക്ക് അറിയാൻ സാധിക്കും.
React ആപ്പുകൾക്കായി ഒരു അധിക നിയമം കൂടി പാലിക്കുക. പുതിയ ഡാറ്റ റീഡ് ചെയ്തതിന് ശേഷം മാത്രം സ്ക്രീൻ അസേർട്ട് (assert) ചെയ്യുക. ഒപ്റ്റിമിസ്റ്റിക് ക്ലയന്റ് സ്റ്റേറ്റിൽ (optimistic client state) വിശ്വസിക്കരുത്. ഒരു മ്യൂട്ടേഷൻ (mutation) സക്സസ് ആകാം, എന്നാൽ ബാക്കെൻഡ് മാറ്റം പൂർത്തിയാക്കിയിട്ടില്ലെങ്കിൽ പേജ് റീലോഡ് ചെയ്യുമ്പോൾ പഴയ വാല്യൂ തന്നെ തിരികെ വരാം.
ഒരു നല്ല എൻഡ്-ടു-എൻഡ് (end-to-end) ടെസ്റ്റ് ഈ കാര്യങ്ങൾ പരിശോധിക്കണം:
- ഇമെയിൽ പഴയ അഡ്രസ്സിലേക്കല്ല, മറിച്ച് പെൻഡിംഗ് അഡ്രസ്സിലേക്കാണ് പോയതെന്ന് ഉറപ്പാക്കുക.
- ലിങ്ക് ശരിയായ എൻവയോൺമെന്റ് ഹോസ്റ്റിലേക്കാണ് (environment host) പോയി എന്ന് പരിശോധിക്കുക.
- ലിങ്ക് അക്കൗണ്ട് റെക്കോർഡ് അപ്ഡേറ്റ് ചെയ്യുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
- ഒരു റീഫെച്ചിന് (refetch) ശേഷം പഴയ അഡ്രസ്സ് അപ്രത്യക്ഷമാകുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
- ഒരേ ലിങ്ക് വീണ്ടും ഉപയോഗിക്കാൻ ശ്രമിച്ചാൽ അത് സുരക്ഷിതമായി പരാജയപ്പെടുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
നിങ്ങളുടെ React ക്വറി കാഷെ (query cache) അല്ലെങ്കിൽ ക്ലയന്റ് സ്റ്റോർ (client store) പഴയതാണെങ്കിൽ, ഫീച്ചർ തകരാറിലായതായി തോന്നും. സെറ്റിംഗ്സ് സ്ക്രീൻ യഥാർത്ഥ വിവരങ്ങൾ കാണിക്കുന്നുണ്ടോ എന്നതിനെക്കുറിച്ച് മാത്രമേ ഉപഭോക്താവിന് താൽപ്പര്യമുള്ളൂ.
ഓരോ റിക്വസ്റ്റിലും ഒരു കോറിലേഷൻ ഐഡി (correlation ID) കൂടി ചേർക്കണം. ഇത് ഒരു യൂസറിൽ നിന്ന് മെസ്സേജ് ഡെലിവറി വരെയും, ഒടുവിൽ കൺഫർമേഷൻ വരെയുള്ള റിക്വസ്റ്റ് ട്രാസ്സ് ചെയ്യാൻ സഹായിക്കും.
ഐസൊലേറ്റഡ് ഇൻബോക്സുകൾ യൂണിറ്റ് ടെസ്റ്റുകൾക്ക് പകരമാവില്ല. ഫോം വാലിഡേഷനും API എററുകൾക്കും യൂണിറ്റ് ടെസ്റ്റുകൾ ഉപയോഗിക്കുക. എല്ലാ സിസ്റ്റങ്ങളിലും യഥാർത്ഥ കസ്റ്റമർ പാത്ത് പ്രവർത്തിക്കുന്നുണ്ടെന്ന് തെളിയിക്കാൻ ഇൻബോക്സ് ഫ്ലോ ഉപയോഗിക്കുക.
അക്കൗണ്ട് സെറ്റിംഗ്സിലെ മാറ്റങ്ങൾ ഷിപ്പ് ചെയ്യുന്നതിന് മുമ്പ്, ഈ കാര്യങ്ങൾ പരിശോധിക്കുക:
- യഥാർത്ഥ React UI-ൽ നിന്ന് മാറ്റത്തിന് റിക്വസ്റ്റ് ചെയ്യുക.
- മെസ്സേജ് ആ പ്രത്യേക റണ്ണിന് മാത്രമുള്ള ഇൻബോക്സിലേക്ക് എത്തുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
- ഒരു റീഫെച്ചിന് ശേഷം പുതിയ അഡ്രസ്സ് കാണിക്കുന്നുണ്ടെന്ന് പരിശോധിക്കുക.
- പഴയ ലിങ്ക് വീണ്ടും ഉപയോഗിക്കാൻ കഴിയില്ലെന്ന് ഉറപ്പാക്കുക.
- മാറ്റം ആര് ആരംഭിച്ചുവെന്ന് ഓഡിറ്റ് ലോഗുകൾ കാണിക്കുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
ഇത് ഐസൊലേഷനിൽ എല്ലാം ശരിയാണെന്ന് തോന്നുകയും എന്നാൽ യഥാർത്ഥ ലോകത്ത് പരാജയപ്പെടുകയും ചെയ്യുന്ന ബഗ്ഗുകളെ തടയുന്നു.