feat: Update signIn paths to append extra redirect

src/pages/EnterpriseLandingPage/ProviderCard/ProviderCard.test.tsx

@@ -1,148 +1,173 @@
 import { render, screen } from '@testing-library/react'
+import qs from 'qs'
 import { MemoryRouter, Route } from 'react-router-dom'
 
+import config from 'config'
+
+import { EnterpriseLoginProviders } from 'services/config/LoginProvidersQueryOpts'
 import { ThemeContextProvider } from 'shared/ThemeContext'
 import { LoginProvidersEnum } from 'shared/utils/loginProviders'
 
-import ProviderCard, { InternalProviderButton } from './ProviderCard'
-
-const wrapper: React.FC<React.PropsWithChildren> = ({ children }) => (
-  <ThemeContextProvider>
-    <MemoryRouter initialEntries={['/']}>
-      <Route path="/">{children}</Route>
-    </MemoryRouter>
-  </ThemeContextProvider>
-)
-
-describe('ProviderCard', () => {
-  describe('Bitbucket', () => {
-    describe('when system is configured with Bitbucket', () => {
-      it('renders external login button', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.BITBUCKET}
-            providers={['BITBUCKET']}
-          />,
-          { wrapper }
-        )
-
-        const element = screen.getByRole('link', {
-          name: 'Login via Bitbucket',
-        })
-        expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/bb')
-      })
+import ProviderCard from './ProviderCard'
 
-      it('renders self hosted login link', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.BITBUCKET}
-            providers={['BITBUCKET_SERVER']}
-          />,
-          { wrapper }
-        )
+vi.mock('config')
+config.API_URL = 'secret-api-url'
 
-        const element = screen.getByRole('link', {
-          name: 'Login via Bitbucket Server',
-        })
-        expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/bbs')
-      })
-    })
+const { location } = window
+beforeEach(() => {
+  Object.defineProperty(window, 'location', {
+    value: { ...location, protocol: 'http:', host: 'secret-api-url' },
   })
+})
 
-  describe('GitHub', () => {
-    describe('when system is configured with GitHub', () => {
-      it('renders external login button', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.GITHUB}
-            providers={['GITHUB']}
-          />,
-          { wrapper }
-        )
-
-        const element = screen.getByRole('link', { name: 'Login via GitHub' })
-        expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/gh')
-      })
+afterEach(() => {
+  Object.defineProperty(window, 'location', { value: location })
+})
 
-      it('renders self hosted login link', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.GITHUB}
-            providers={['GITHUB_ENTERPRISE']}
-          />,
-          { wrapper }
-        )
+const wrapper =
+  (initialEntries = '/'): React.FC<React.PropsWithChildren> =>
+  ({ children }) => (
+    <ThemeContextProvider>
+      <MemoryRouter initialEntries={[initialEntries]}>
+        <Route path="/">{children}</Route>
+      </MemoryRouter>
+    </ThemeContextProvider>
+  )
 
-        const element = screen.getByRole('link', {
-          name: 'Login via GitHub Enterprise',
-        })
-        expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/ghe')
-      })
-    })
-  })
+type LoginProviders = typeof LoginProvidersEnum
 
-  describe('GitLab', () => {
-    describe('when system is configured with GitLab', () => {
-      it('renders external login button', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.GITLAB}
-            providers={['GITLAB']}
-          />,
-          { wrapper }
-        )
-
-        const element = screen.getByRole('link', { name: 'Login via GitLab' })
-        expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/gl')
-      })
+type Provider = {
+  [K in keyof LoginProviders]: LoginProviders[K]
+}[keyof LoginProviders]
 
-      it('renders self hosted login link', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.GITLAB}
-            providers={['GITLAB_ENTERPRISE']}
-          />,
-          { wrapper }
-        )
+describe('ProviderCard', () => {
+  interface Case {
+    provider: Provider
+    name: string
+    providers: Array<EnterpriseLoginProviders>
+    to: string
+  }
+
+  const cases: Case[] = [
+    {
+      provider: LoginProvidersEnum.BITBUCKET,
+      name: LoginProvidersEnum.BITBUCKET.name,
+      providers: ['BITBUCKET'],
+      to: '/login/bb',
+    },
+    {
+      provider: LoginProvidersEnum.BITBUCKET,
+      name: LoginProvidersEnum.BITBUCKET.selfHostedName,
+      providers: ['BITBUCKET_SERVER'],
+      to: '/login/bbs',
+    },
+    {
+      provider: LoginProvidersEnum.GITHUB,
+      name: LoginProvidersEnum.GITHUB.name,
+      providers: ['GITHUB'],
+      to: '/login/gh',
+    },
+    {
+      provider: LoginProvidersEnum.GITHUB,
+      name: LoginProvidersEnum.GITHUB.selfHostedName,
+      providers: ['GITHUB_ENTERPRISE'],
+      to: '/login/ghe',
+    },
+    {
+      provider: LoginProvidersEnum.GITLAB,
+      name: LoginProvidersEnum.GITLAB.name,
+      providers: ['GITLAB'],
+      to: '/login/gl',
+    },
+    {
+      provider: LoginProvidersEnum.GITLAB,
+      name: LoginProvidersEnum.GITLAB.selfHostedName,
+      providers: ['GITLAB_ENTERPRISE'],
+      to: '/login/gle',
+    },
+    {
+      provider: LoginProvidersEnum.OKTA,
+      name: LoginProvidersEnum.OKTA.name,
+      providers: ['OKTA'],
+      to: '/login/okta',
+    },
+  ]
+
+  describe.each(cases)('$name', ({ provider, providers, to, name }) => {
+    describe('when system is configured with $providers.[0]', () => {
+      it('renders the correct login button', () => {
+        render(<ProviderCard provider={provider} providers={providers} />, {
+          wrapper: wrapper(),
+        })
 
         const element = screen.getByRole('link', {
-          name: 'Login via GitLab CE/EE',
+          name: `Login via ${name}`,
         })
         expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/gle')
+        expect(element).toHaveAttribute('href', `secret-api-url${to}`)
       })
     })
   })
 
-  describe('Okta', () => {
-    describe('when system is configured with Okta', () => {
-      it('renders external login button', () => {
-        render(
-          <ProviderCard
-            provider={LoginProvidersEnum.OKTA}
-            providers={['OKTA']}
-          />,
-          { wrapper }
-        )
-
-        const element = screen.getByRole('link', { name: 'Login via Okta' })
-        expect(element).toBeInTheDocument()
-        expect(element).toHaveAttribute('href', '/login/okta')
-      })
-    })
-
-    it('InternalProviderButton returns null', () => {
-      const { container } = render(
-        <InternalProviderButton provider={LoginProvidersEnum.OKTA} />,
-        { wrapper }
-      )
-
-      expect(container).toBeEmptyDOMElement()
-    })
+  describe('when to param is provided', () => {
+    interface Case {
+      provider: typeof LoginProvidersEnum.GITHUB
+      isSelfHosted: boolean
+      name: string
+      providers: Array<EnterpriseLoginProviders>
+      to: string
+    }
+
+    const cases: Case[] = [
+      {
+        provider: LoginProvidersEnum.GITHUB,
+        isSelfHosted: false,
+        name: LoginProvidersEnum.GITHUB.name,
+        providers: ['GITHUB'],
+        to: '/login/gh',
+      },
+      {
+        provider: LoginProvidersEnum.GITHUB,
+        isSelfHosted: true,
+        name: LoginProvidersEnum.GITHUB.selfHostedName,
+        providers: ['GITHUB_ENTERPRISE'],
+        to: '/login/ghe',
+      },
+    ]
+
+    describe.each(cases)(
+      '$name',
+      ({ provider, providers, name, isSelfHosted }) => {
+        describe(`is ${isSelfHosted ? 'self hosted' : 'external'} provider`, () => {
+          it('appends redirect param to the login url', () => {
+            const key = isSelfHosted
+              ? provider.selfHostedKey
+              : provider.externalKey
+            const queryString = qs.stringify(
+              { to: `/${key}/codecov/gazebo` },
+              { addQueryPrefix: true }
+            )
+
+            render(<ProviderCard provider={provider} providers={providers} />, {
+              wrapper: wrapper(`/login/${key}${queryString}`),
+            })
+
+            const redirectURL = qs.stringify(
+              { to: `http://secret-api-url/${key}${queryString}` },
+              { addQueryPrefix: true }
+            )
+
+            const element = screen.getByRole('link', {
+              name: `Login via ${name}`,
+            })
+            expect(element).toBeInTheDocument()
+            expect(element).toHaveAttribute(
+              'href',
+              `secret-api-url/login/${key}${redirectURL}`
+            )
+          })
+        })
+      }
+    )
   })
 })