Fix the tests by using event delegation
This commit is contained in:
parent
849008231c
commit
1d1260060e
2 changed files with 25 additions and 24 deletions
|
@ -1,30 +1,31 @@
|
|||
import { on, show, hide } from '@utils';
|
||||
import { delegate, show, hide } from '@utils';
|
||||
import { suggest } from 'email-butler';
|
||||
|
||||
const user_new_email_selector = '#new_user > #user_email';
|
||||
const suspectSuggestionsBox = document.querySelector('.suspect-email');
|
||||
const emailSuggestionSpan = document.querySelector(
|
||||
'.suspect-email .question .suggested-email'
|
||||
);
|
||||
const userNewEmailSelector = '#new_user input#user_email';
|
||||
const suggestionsSelector = '.suspect-email';
|
||||
const emailSuggestionSelector = '.suspect-email .suggested-email';
|
||||
|
||||
on(user_new_email_selector, 'blur', () => {
|
||||
delegate('focusout', userNewEmailSelector, () => {
|
||||
// When the user leaves the email input during account creation, we check if this account looks correct.
|
||||
// If not (e.g if its "bidou@gmail.coo" or "john@yahoo.rf") we attempt to suggest a fix for the invalid email.
|
||||
const suggestion = suggest(
|
||||
document.querySelector(user_new_email_selector).value
|
||||
);
|
||||
if (suggestion.full) {
|
||||
emailSuggestionSpan.innerHTML = suggestion.full;
|
||||
show(suspectSuggestionsBox);
|
||||
// If not (e.g if its "bidou@gmail.coo" or "john@yahoo.rf"), we attempt to suggest a fix for the invalid email.
|
||||
const userEmailInput = document.querySelector(userNewEmailSelector);
|
||||
const suggestedEmailSpan = document.querySelector(emailSuggestionSelector);
|
||||
|
||||
const suggestion = suggest(userEmailInput.value);
|
||||
if (suggestion && suggestion.full) {
|
||||
suggestedEmailSpan.innerHTML = suggestion.full;
|
||||
show(document.querySelector(suggestionsSelector));
|
||||
}
|
||||
});
|
||||
|
||||
export function acceptEmailSuggestion() {
|
||||
document.querySelector(user_new_email_selector).value =
|
||||
emailSuggestionSpan.innerHTML;
|
||||
hide(suspectSuggestionsBox);
|
||||
const userEmailInput = document.querySelector(userNewEmailSelector);
|
||||
const suggestedEmailSpan = document.querySelector(emailSuggestionSelector);
|
||||
|
||||
userEmailInput.value = suggestedEmailSpan.innerHTML;
|
||||
hide(document.querySelector(suggestionsSelector));
|
||||
}
|
||||
|
||||
export function discardEmailSuggestionBox() {
|
||||
hide(suspectSuggestionsBox);
|
||||
hide(document.querySelector(suggestionsSelector));
|
||||
}
|
||||
|
|
|
@ -17,25 +17,25 @@ feature 'Signing up:' do
|
|||
expect(page).to have_current_path commencer_path(path: procedure.path)
|
||||
end
|
||||
|
||||
context 'a new user can sign-up and be suggested a valid email when he makes a typo' do
|
||||
context 'when the user makes a typo in their email address' do
|
||||
let(:procedure) { create :simple_procedure, :with_service }
|
||||
|
||||
before do
|
||||
visit commencer_path(path: procedure.path)
|
||||
click_on 'Créer un compte demarches-simplifiees.fr'
|
||||
expect(page).to have_selector('.suspect-email', visible: false)
|
||||
fill_in :user_email, with: 'bidou@yahoo.rf'
|
||||
fill_in :user_password, with: '12345'
|
||||
fill_in 'Email', with: 'bidou@yahoo.rf'
|
||||
fill_in 'Mot de passe', with: '12345'
|
||||
end
|
||||
|
||||
scenario 'it can accept the suggestion' do
|
||||
scenario 'they can accept the suggestion', js: true do
|
||||
expect(page).to have_selector('.suspect-email', visible: true)
|
||||
click_on 'Oui'
|
||||
# expect(page).to have_field("Email", :with => 'bidou@yahoo.fr')
|
||||
expect(page).to have_field("Email", :with => 'bidou@yahoo.fr')
|
||||
expect(page).to have_selector('.suspect-email', visible: false)
|
||||
end
|
||||
|
||||
scenario 'it can discard the suggestion' do
|
||||
scenario 'they can discard the suggestion', js: true do
|
||||
expect(page).to have_selector('.suspect-email', visible: true)
|
||||
click_on 'Non'
|
||||
expect(page).to have_field("Email", :with => 'bidou@yahoo.rf')
|
||||
|
|
Loading…
Reference in a new issue