Maintenance: Add guided system test for new desktop view

app/frontend/apps/desktop/entities/channel-email/composables/useEmailAccountForm.ts

@@ -21,7 +21,7 @@ export const useEmailAccountForm = () => {
       children: [
         {
           name: 'realname',
-          label: __('Full Name'),
+          label: __('Full name'),
           type: 'text',
           props: {
             placeholder: __('Organization Support'),
@@ -30,7 +30,7 @@ export const useEmailAccountForm = () => {
         },
         {
           name: 'email',
-          label: __('Email Address'),
+          label: __('Email address'),
           type: 'email',
           props: {},
           validation: 'email',

app/frontend/apps/desktop/entities/channel-email/composables/useEmailOutboundForm.ts

@@ -49,7 +49,7 @@ export const useEmailOutboundForm = () => {
           children: [
             {
               name: 'adapter',
-              label: __('Send Mails via'),
+              label: __('Send mails via'),
               type: 'select',
               outerClass: 'col-span-2',
               required: true,

app/frontend/apps/desktop/pages/guided-setup/__tests__/guided-setup-manual-channel-email.spec.ts

@@ -146,12 +146,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -197,12 +197,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -242,12 +242,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -299,12 +299,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -360,12 +360,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -441,12 +441,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -509,12 +509,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -569,12 +569,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -693,12 +693,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 
@@ -767,12 +767,12 @@ describe('guided setup manual channel email', () => {
       const accountForm = view.getByTestId('channel-email-account')
 
       await view.events.type(
-        getByLabelText(accountForm, 'Full Name'),
+        getByLabelText(accountForm, 'Full name'),
         'Zammad Helpdesk',
       )
 
       await view.events.type(
-        getByLabelText(accountForm, 'Email Address'),
+        getByLabelText(accountForm, 'Email address'),
         'zammad@mail.test.dc.zammad.com',
       )
 

app/frontend/apps/desktop/pages/guided-setup/__tests__/guided-setup-manual-email-notification.spec.ts

@@ -99,7 +99,7 @@ describe('guided setup manual email notification', () => {
       await getNode('email-notification-setup')?.settled
 
       expect(view.getByText('Email Notification')).toBeInTheDocument()
-      expect(view.getByLabelText('Send Mails via')).toBeInTheDocument()
+      expect(view.getByLabelText('Send mails via')).toBeInTheDocument()
 
       const continueButton = view.getByRole('button', {
         name: 'Save and Continue',
@@ -125,7 +125,7 @@ describe('guided setup manual email notification', () => {
 
       expect(queryByRole(form, 'alert')).not.toBeInTheDocument()
 
-      const adapterField = view.getByLabelText('Send Mails via')
+      const adapterField = view.getByLabelText('Send mails via')
 
       await view.events.click(adapterField)
       await view.events.click(view.getAllByRole('option')[0])
@@ -162,7 +162,7 @@ describe('guided setup manual email notification', () => {
       await flushPromises()
       await getNode('email-notification-setup')?.settled
 
-      const adapterField = view.getByLabelText('Send Mails via')
+      const adapterField = view.getByLabelText('Send mails via')
 
       await view.events.click(adapterField)
       await view.events.click(view.getAllByRole('option')[0])
@@ -213,7 +213,7 @@ describe('guided setup manual email notification', () => {
       await flushPromises()
       await getNode('email-notification-setup')?.settled
 
-      const adapterField = view.getByLabelText('Send Mails via')
+      const adapterField = view.getByLabelText('Send mails via')
 
       await view.events.click(adapterField)
       await view.events.click(view.getAllByRole('option')[0])

app/frontend/apps/desktop/pages/guided-setup/__tests__/guided-setup-manual-email-pre-configured.spec.ts

@@ -46,7 +46,7 @@ describe('guided setup manual email notification', () => {
       })
 
       expect(view.getByText('Email Account')).toBeInTheDocument()
-      expect(view.getByText('Email Address')).toBeInTheDocument()
+      expect(view.getByText('Email address')).toBeInTheDocument()
     })
   })
 

app/frontend/apps/desktop/pages/guided-setup/__tests__/guided-setup-manual-system-information.spec.ts

@@ -56,9 +56,9 @@ describe('guided setup system information', () => {
         view.queryByRole('button', { name: 'Go Back' }),
       ).not.toBeInTheDocument()
 
-      const organizationField = view.getByLabelText('Organization Name')
+      const organizationField = view.getByLabelText('Organization name')
       const urlField = view.getByLabelText('System URL')
-      const logoField = view.getByLabelText('Organization Logo')
+      const logoField = view.getByLabelText('Organization logo')
 
       expect(organizationField).toBeInTheDocument()
       expect(urlField).toBeInTheDocument()

app/frontend/apps/desktop/pages/guided-setup/views/GuidedSetupManual/GuidedSetupManualSystemInformation.vue

@@ -37,14 +37,14 @@ const systemInformationSchema = [
     children: [
       {
         name: 'organization',
-        label: __('Organization Name'),
+        label: __('Organization name'),
         type: 'text',
         required: true,
         placeholder: __('Company Inc.'),
       },
       {
         name: 'logo',
-        label: __('Organization Logo'),
+        label: __('Organization logo'),
         type: 'imageUpload',
         props: {
           placeholderImagePath: logoUrl,

i18n/zammad.pot

@@ -5360,7 +5360,6 @@ msgstr ""
 #: app/assets/javascripts/app/views/channel/email_account_overview.jst.eco:126
 #: app/assets/javascripts/app/views/google/list.jst.eco:81
 #: app/assets/javascripts/app/views/microsoft365/list.jst.eco:82
-#: app/frontend/apps/desktop/entities/channel-email/composables/useEmailAccountForm.ts:33
 msgid "Email Address"
 msgstr ""
 
@@ -5397,6 +5396,10 @@ msgstr ""
 msgid "Email Verification"
 msgstr ""
 
+#: app/frontend/apps/desktop/entities/channel-email/composables/useEmailAccountForm.ts:33
+msgid "Email address"
+msgstr ""
+
 #: app/models/user.rb:609
 msgid "Email address '%{email}' is already used for another user."
 msgstr ""
@@ -6464,10 +6467,13 @@ msgid "Full"
 msgstr ""
 
 #: app/assets/javascripts/app/views/getting_started/email.jst.eco:11
-#: app/frontend/apps/desktop/entities/channel-email/composables/useEmailAccountForm.ts:24
 msgid "Full Name"
 msgstr ""
 
+#: app/frontend/apps/desktop/entities/channel-email/composables/useEmailAccountForm.ts:24
+msgid "Full name"
+msgstr ""
+
 #: db/seeds/settings.rb:263
 msgid "Fully Qualified Domain Name"
 msgstr ""
@@ -10338,12 +10344,7 @@ msgstr ""
 msgid "Organization & Department Name"
 msgstr ""
 
-#: app/frontend/apps/desktop/pages/guided-setup/views/GuidedSetupManual/GuidedSetupManualSystemInformation.vue:47
-msgid "Organization Logo"
-msgstr ""
-
 #: app/assets/javascripts/app/views/getting_started/base.jst.eco:9
-#: app/frontend/apps/desktop/pages/guided-setup/views/GuidedSetupManual/GuidedSetupManualSystemInformation.vue:40
 msgid "Organization Name"
 msgstr ""
 
@@ -10357,6 +10358,14 @@ msgstr ""
 msgid "Organization could not be updated."
 msgstr ""
 
+#: app/frontend/apps/desktop/pages/guided-setup/views/GuidedSetupManual/GuidedSetupManualSystemInformation.vue:47
+msgid "Organization logo"
+msgstr ""
+
+#: app/frontend/apps/desktop/pages/guided-setup/views/GuidedSetupManual/GuidedSetupManualSystemInformation.vue:40
+msgid "Organization name"
+msgstr ""
+
 #: app/frontend/apps/mobile/pages/user/views/UserDetailView.vue:78
 msgid "Organization tickets"
 msgstr ""
@@ -12403,7 +12412,6 @@ msgstr ""
 #: app/assets/javascripts/app/controllers/_channel/email.coffee:397
 #: app/assets/javascripts/app/controllers/getting_started/channel_email.coffee:65
 #: app/assets/javascripts/app/controllers/getting_started/email_notification.coffee:50
-#: app/frontend/apps/desktop/entities/channel-email/composables/useEmailOutboundForm.ts:52
 msgid "Send Mails via"
 msgstr ""
 
@@ -12411,6 +12419,10 @@ msgstr ""
 msgid "Send a message to all logged in users."
 msgstr ""
 
+#: app/frontend/apps/desktop/entities/channel-email/composables/useEmailOutboundForm.ts:52
+msgid "Send mails via"
+msgstr ""
+
 #: app/assets/javascripts/app/views/whatsapp/account_phone_number.jst.eco:40
 msgid "Send out automatic reminders to customers asking them for reply if the 24-hour window is about to expire."
 msgstr ""

spec/system/apps/desktop/guided_setup_spec.rb

@@ -0,0 +1,72 @@
+# Copyright (C) 2012-2024 Zammad Foundation, https://zammad-foundation.org/
+
+require 'rails_helper'
+
+RSpec.describe 'Desktop > Guided Setup', app: :desktop_view, authenticated_as: false, required_envs: %w[MAIL_ADDRESS MAIL_PASS], set_up: false, type: :system do
+
+  before do
+    # Import mail server CA certificate into the trust store.
+    SSLCertificate.create!(certificate: Rails.root.join('spec/fixtures/files/imap/ca.crt').read)
+
+    allow(NotificationFactory::Mailer).to receive(:notification)
+  end
+
+  after do
+    # Make sure lock is lifted even on test errors.
+    Redis.new(driver: :hiredis, url: ENV['REDIS_URL'].presence || 'redis://localhost:6379').del('Zammad::System::Setup')
+  end
+
+  it 'Perform the basic system set-up' do # rubocop:disable RSpec/ExampleLength
+    visit '/'
+
+    click_on 'Set up a new system'
+
+    # Invalid password
+    fill_in 'First name', with: 'John'
+    fill_in 'Last name', with: 'Doe'
+    fill_in 'Email', with: 'john.doe@example.com'
+    fill_in 'Password', with: '1234'
+    fill_in 'Confirm password', with: '1234'
+    click_on 'Create account'
+
+    expect(page).to have_text('Invalid password')
+
+    # Valid password, create account
+    fill_in 'Password', with: 'testTEST1234'
+    fill_in 'Confirm password', with: 'testTEST1234'
+    click_on 'Create account'
+
+    fill_in 'Organization name', with: 'Test corp.'
+    find('input[name="logo"]', visible: :all).set(Rails.root.join('test/data/image/1000x1000.png'))
+    fill_in 'System URL', with: app_host
+    click_on 'Save and Continue'
+
+    # Accept default setting (local MTA).
+    expect(page).to have_text('Email Notification')
+    click_on 'Save and Continue'
+
+    click_on 'Email Channel'
+    fill_in 'Full name', with: 'John Doe'
+    fill_in 'Email address', with: ENV['MAIL_ADDRESS']
+    fill_in 'Password', with: ENV['MAIL_PASS']
+    click_on 'Connect and Continue'
+
+    expect(page).to have_text('Verifying and saving your configuration…')
+
+    expect(page).to have_text('Invite Colleagues', wait: 2.minutes)
+
+    fill_in 'First name', with: 'Jim'
+    fill_in 'Last name', with: 'Doe'
+    fill_in 'Email', with: 'jim.doe@example.com'
+    click_on 'Send Invitation'
+    expect(page).to have_text('Invitation sent!')
+
+    click_on('Finish Setup')
+
+    expect(NotificationFactory::Mailer).to have_received(:notification).once
+
+    expect_current_route('/')
+
+    # TODO: check for "clues" in UI, not available yet.
+  end
+end