Fix the tests by using event delegation

This commit is contained in:
Pierre de La Morinerie 2019-12-02 17:16:18 +01:00
parent 849008231c
commit 1d1260060e
2 changed files with 25 additions and 24 deletions

View file

@ -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));
}

View file

@ -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')