LG-775 Do not present FIDO auth option if browser does not support FIDO

app/javascript/packs/webauthn-setup.js

@@ -71,7 +71,7 @@ function webauthn() {
   };
   if (location.href.indexOf('?error=') === -1 &&
     !(navigator && navigator.credentials && navigator.credentials.create)) {
-    window.location.href = '/webauthn_setup?error=NotSupportedError';
+    window.location.href = '/login/two_factor/options';
   }
   const continueButton = document.getElementById('continue-button');
   continueButton.addEventListener('click', () => {

app/javascript/packs/webauthn-unhide.js

@@ -0,0 +1,17 @@
+function unhideWebauthn() {
+  if (navigator && navigator.credentials && navigator.credentials.create) {
+    const elem = document.getElementById('select_webauthn');
+    if (elem) {
+      elem.classList.remove('hidden');
+    }
+  } else {
+    const checkboxes = document.querySelectorAll('input[name="two_factor_options_form[selection]"]');
+    for (let i = 0, len = checkboxes.length; i < len; i += 1) {
+      if (!checkboxes[i].classList.contains('hidden')) {
+        checkboxes[i].checked = true;
+        break;
+      }
+    }
+  }
+}
+document.addEventListener('DOMContentLoaded', unhideWebauthn);

app/presenters/two_factor_authentication/selection_presenter.rb

@@ -21,6 +21,10 @@ def info
       t("two_factor_authentication.#{option_mode}.#{method}_info")
     end
 
+    def html_class
+      ''
+    end
+
     private
 
     def option_mode

app/presenters/two_factor_authentication/webauthn_selection_presenter.rb

@@ -3,5 +3,9 @@ class WebauthnSelectionPresenter < SelectionPresenter
     def method
       :webauthn
     end
+
+    def html_class
+      'hidden'
+    end
   end
 end

app/views/two_factor_authentication/options/index.html.slim

@@ -11,18 +11,22 @@ p.mt-tiny.mb3 = @presenter.info
     fieldset.m0.p0.border-none.
       legend.mb2.serif.bold = @presenter.label
       - @presenter.options.each_with_index do |option, index|
-        label.btn-border.col-12.mb2 for="two_factor_options_form_selection_#{option.type}"
-          .radio
-            = radio_button_tag('two_factor_options_form[selection]',
+        span id="select_#{option.type}" class="#{option.html_class}"
+          label.btn-border.col-12.mb2 for="two_factor_options_form_selection_#{option.type}"
+            .radio
+              = radio_button_tag('two_factor_options_form[selection]',
                     option.type,
-                    index.zero?)
-            span.indicator.mt-tiny
-            span.blue.bold.fs-20p = option.label
-            .regular.gray-dark.fs-10p.mb-tiny = option.info
+                    index.zero?,
+                    class: option.html_class.to_s)
+              span.indicator.mt-tiny
+              span.blue.bold.fs-20p = option.label
+              .regular.gray-dark.fs-10p.mb-tiny = option.info
 
   = f.button :submit, t('forms.buttons.continue')
 
 br
 - if @presenter.should_display_account_reset_or_cancel_link?
   p = @presenter.account_reset_or_cancel_link
 = render 'shared/cancel', link: destroy_user_session_path
+
+== javascript_pack_tag 'webauthn-unhide'

spec/presenters/two_factor_authentication/webauthn_selection_presenter_spec.rb

@@ -9,4 +9,10 @@
       expect(subject.type).to eq 'webauthn'
     end
   end
+
+  describe '#html_class' do
+    it 'returns hidden' do
+      expect(subject.html_class).to eq 'hidden'
+    end
+  end
 end