test: 💍 fixes flaky theme selection test (#1592)

✅ Closes: icu-7597

ui/admin/app/templates/application.hbs

@@ -32,12 +32,18 @@
               <Rose::Form as |form|>
                 <form.radioGroup
                   @name='theme'
-                  @selectedValue={{this.session.data.theme}}
+                  @selectedValue={{or
+                    this.session.data.theme
+                    'system-default-theme'
+                  }}
                   @changed={{route-action 'toggleTheme'}}
                   as |radioGroup|
                 >
                   <dropdown.item>
-                    <radioGroup.radio @label={{t 'themes.system'}} />
+                    <radioGroup.radio
+                      @label={{t 'themes.system'}}
+                      @value='system-default-theme'
+                    />
                   </dropdown.item>
                   <dropdown.item>
                     <radioGroup.radio

ui/admin/tests/acceptance/authentication-test.js

@@ -350,8 +350,11 @@ module('Acceptance | authentication', function (hooks) {
     assert.notOk(getRootElement().classList.contains('rose-theme-light'));
     assert.ok(getRootElement().classList.contains('rose-theme-dark'));
     // toggle system default
-    await click('[name="theme"][value=""]');
-    assert.notOk(currentSession().get('data.theme'));
+    await click('[name="theme"][value="system-default-theme"]');
+    assert.strictEqual(
+      currentSession().get('data.theme'),
+      'system-default-theme'
+    );
     assert.notOk(getRootElement().classList.contains('rose-theme-light'));
     assert.notOk(getRootElement().classList.contains('rose-theme-dark'));
   });

ui/desktop/app/templates/application.hbs

@@ -55,12 +55,18 @@
               <Rose::Form as |form|>
                 <form.radioGroup
                   @name='theme'
-                  @selectedValue={{this.session.data.theme}}
+                  @selectedValue={{or
+                    this.session.data.theme
+                    'system-default-theme'
+                  }}
                   @changed={{route-action 'toggleTheme'}}
                   as |radioGroup|
                 >
                   <dropdown.item>
-                    <radioGroup.radio @label={{t 'themes.system'}} />
+                    <radioGroup.radio
+                      @label={{t 'themes.system'}}
+                      @value='system-default-theme'
+                    />
                   </dropdown.item>
                   <dropdown.item>
                     <radioGroup.radio

ui/desktop/tests/acceptance/authentication-test.js

@@ -242,8 +242,11 @@ module('Acceptance | authentication', function (hooks) {
     assert.notOk(getRootElement().classList.contains('rose-theme-light'));
     assert.ok(getRootElement().classList.contains('rose-theme-dark'));
     // toggle system default
-    await click('[name="theme"][value=""]');
-    assert.notOk(currentSession().get('data.theme'));
+    await click('[name="theme"][value="system-default-theme"]');
+    assert.strictEqual(
+      currentSession().get('data.theme'),
+      'system-default-theme'
+    );
     assert.notOk(getRootElement().classList.contains('rose-theme-light'));
     assert.notOk(getRootElement().classList.contains('rose-theme-dark'));
   });