From 3f783799e4c4472c1a7b470b4b4fe4ac37cda19a Mon Sep 17 00:00:00 2001
From: Lachlan Miller <lachlan.miller.1990@outlook.com>
Date: Thu, 25 Aug 2022 14:25:23 +1000
Subject: [PATCH] chore: fix some tests, minor refactor (#23545)

* fix test

* fix test

* add noHelp link to StandardModal
---
 .../src/navigation/KeyboardBindingsModal.vue  |  2 +-
 .../app/src/runner/studio/StudioSaveModal.vue |  1 +
 .../src/components/StandardModal.cy.tsx       | 26 +++++++++++++++++
 .../src/components/StandardModal.vue          |  5 +++-
 .../src/components/StandardModalHeader.vue    | 29 +++++++++++--------
 .../topnav/UpdateCypressModal.vue             |  2 +-
 packages/reporter/cypress/e2e/tests.cy.ts     |  4 +++
 7 files changed, 54 insertions(+), 15 deletions(-)

diff --git a/packages/app/src/navigation/KeyboardBindingsModal.vue b/packages/app/src/navigation/KeyboardBindingsModal.vue
index fb1457dc70eb..7df4956b3193 100644
--- a/packages/app/src/navigation/KeyboardBindingsModal.vue
+++ b/packages/app/src/navigation/KeyboardBindingsModal.vue
@@ -5,7 +5,7 @@
     :title="t('sidebar.keyboardShortcuts.title')"
     :model-value="show"
     data-cy="keyboard-modal"
-    help-link=""
+    :no-help="true"
     @update:model-value="emits('close')"
   >
     <ul class="m-24px w-384px">
diff --git a/packages/app/src/runner/studio/StudioSaveModal.vue b/packages/app/src/runner/studio/StudioSaveModal.vue
index 2f087f46fda4..c11bcc8d5d0f 100644
--- a/packages/app/src/runner/studio/StudioSaveModal.vue
+++ b/packages/app/src/runner/studio/StudioSaveModal.vue
@@ -1,6 +1,7 @@
 <template>
   <StandardModal
     :model-value="props.open"
+    :no-help="true"
     variant="bare"
     data-cy="studio-save-modal"
     @update:model-value="emit('close')"
diff --git a/packages/frontend-shared/src/components/StandardModal.cy.tsx b/packages/frontend-shared/src/components/StandardModal.cy.tsx
index 3ef38becd302..c30dc86e5368 100644
--- a/packages/frontend-shared/src/components/StandardModal.cy.tsx
+++ b/packages/frontend-shared/src/components/StandardModal.cy.tsx
@@ -35,6 +35,32 @@ describe('<StandardModal />', { viewportWidth: 800, viewportHeight: 400 }, () =>
       cy.percySnapshot()
     })
 
+    it('does not render helpLink when noHelp is true', () => {
+      cy.mount(
+        <StandardModal
+          class="w-400px"
+          modelValue={true}
+          noHelp={true}
+          title={title}
+        >
+          {body}
+        </StandardModal>,
+      )
+
+      cy.contains('a', defaultMessages.links.needHelp).should('not.exist')
+
+      cy.findByLabelText(defaultMessages.actions.close, {
+        selector: 'button',
+      })
+      .should('be.visible')
+      .and('not.be.disabled')
+
+      cy.contains('h2', title).should('be.visible')
+      cy.contains(body).should('be.visible')
+
+      cy.percySnapshot()
+    })
+
     it('bare variant renders without padding in body', () => {
       cy.mount(<StandardModal
         class="w-400px"
diff --git a/packages/frontend-shared/src/components/StandardModal.vue b/packages/frontend-shared/src/components/StandardModal.vue
index db4c63e4899a..167743fd9549 100644
--- a/packages/frontend-shared/src/components/StandardModal.vue
+++ b/packages/frontend-shared/src/components/StandardModal.vue
@@ -17,6 +17,7 @@
         :class="props.class || ''"
       >
         <StandardModalHeader
+          :no-help="noHelp"
           :help-link="helpLink"
           :help-text="helpText"
           @close="closeModal"
@@ -72,12 +73,14 @@ const props = withDefaults(defineProps<{
   helpLink?: string
   helpText?: string
   variant?: 'bare'
+  noHelp?: boolean
   title?: string
   class?: string | string[] | Record<string, any>
 }>(), {
   modelValue: false,
   helpText: `${defaultMessages.links.needHelp}`,
-  helpLink: '',
+  noHelp: false,
+  helpLink: 'https://on.cypress.io',
   class: undefined,
   variant: undefined,
   title: '',
diff --git a/packages/frontend-shared/src/components/StandardModalHeader.vue b/packages/frontend-shared/src/components/StandardModalHeader.vue
index 9ba25e54427f..4cc35acc3fb2 100644
--- a/packages/frontend-shared/src/components/StandardModalHeader.vue
+++ b/packages/frontend-shared/src/components/StandardModalHeader.vue
@@ -6,18 +6,20 @@
       <DialogTitle class="text-gray-900 text-18px inline-block">
         <slot />
       </DialogTitle>
-      <span
-        v-if="helpLink.length"
-        class="border-t border-t-gray-100 h-6px mx-8px w-32px inline-block"
-      /> <ExternalLink
-        v-if="helpLink.length"
-        :href="helpLink"
-        class="outline-transparent text-indigo-500 text-16px group"
-      >
-        <span class="group-hocus:underline">{{ helpText }}</span>
+
+      <template v-if="!noHelp">
+        <span class="border-t border-t-gray-100 h-6px mx-8px w-32px inline-block" />
+        <ExternalLink
+          :href="helpLink"
+          class="outline-transparent text-indigo-500 text-16px group"
+        >
+          <span class="group-hocus:underline">{{ helpText }}</span>
+        </ExternalLink>
+
         <i-cy-circle-bg-question-mark_x16 class="ml-8px -top-2px relative inline-block icon-dark-indigo-500 icon-light-indigo-100" />
-      </ExternalLink>
+      </template>
     </div>
+
     <button
       :aria-label="t(`actions.close`)"
       class="border-transparent rounded-full outline-none border-1 group"
@@ -35,10 +37,13 @@ import { useI18n } from '@cy/i18n'
 
 const { t } = useI18n()
 
-defineProps<{
+withDefaults(defineProps<{
   helpLink: string
   helpText: string
-}>()
+  noHelp?: boolean
+}>(), {
+  noHelp: false,
+})
 
 defineEmits<{
   (eventName: 'close'): void
diff --git a/packages/frontend-shared/src/gql-components/topnav/UpdateCypressModal.vue b/packages/frontend-shared/src/gql-components/topnav/UpdateCypressModal.vue
index 0c90463d3c22..d03c32138c05 100644
--- a/packages/frontend-shared/src/gql-components/topnav/UpdateCypressModal.vue
+++ b/packages/frontend-shared/src/gql-components/topnav/UpdateCypressModal.vue
@@ -4,7 +4,7 @@
     variant="bare"
     :title="title"
     :model-value="show"
-    help-link=""
+    :no-help="true"
     @update:model-value="emits('close')"
   >
     <div class="p-24px text-gray-700">
diff --git a/packages/reporter/cypress/e2e/tests.cy.ts b/packages/reporter/cypress/e2e/tests.cy.ts
index c7d4f57b0cce..ef41559e1713 100644
--- a/packages/reporter/cypress/e2e/tests.cy.ts
+++ b/packages/reporter/cypress/e2e/tests.cy.ts
@@ -199,6 +199,10 @@ describe('studio controls', () => {
   })
 
   describe('button', () => {
+    beforeEach(() => {
+      runner.emit('reporter:start', { studioActive: false })
+    })
+
     it('displays studio icon with half transparency when hovering over test title', { scrollBehavior: false }, () => {
       cy.contains('test 1')
       .closest('.runnable-wrapper')