test: raise coverage above 95% floor across profile, clients and whats-on (#620)

* test: raise coverage above 95% floor across profile, clients and whats-on

* test: restructure 4 profile specs to DCL when/should standard

* test: restructure ProfileLayout spec to DCL when/should standard

* test: fix ProfileTabs.types spec tab type to unblock build

Author: braianj

jest.config.ts

@@ -10,6 +10,11 @@ const jestConfig: Config = {
       'ts-jest',
       {
         tsconfig: {
+          // Match the app build target (tsconfig.app.json) so native ES2020
+          // features survive transpilation. Without this, ts-jest down-levels
+          // the `**` operator to `Math.pow`, which throws on BigInt operands
+          // (e.g. `10n ** 18n` in OverviewTab.helpers' `formatPriceMana`).
+          target: 'ES2020',
           esModuleInterop: true,
           jsx: 'react-jsx'
         },

src/components/Layout/DownloadLayout.spec.tsx

@@ -123,6 +123,37 @@ describe('DownloadLayout', () => {
       await userEvent.click(screen.getByText('component.landing.navbar.sign_in'))
       expect(mockRedirectToAuth).toHaveBeenCalledTimes(1)
     })
+
+    it('should navigate to decentraland.org when the logo is clicked', async () => {
+      const assignSpy = jest.fn()
+      const original = window.location
+      // Redefine location so the assignment in the click handler is observable
+      // and does not trigger jsdom's "navigation not implemented" warning.
+      Object.defineProperty(window, 'location', {
+        configurable: true,
+        value: {
+          ...original,
+          set href(value: string) {
+            assignSpy(value)
+          },
+          get href() {
+            return original.href
+          }
+        }
+      })
+      try {
+        render(<DownloadLayout title={TITLE} />)
+        // DclLogo is the label-less clickable element rendered immediately before
+        // the Sign In button in the signed-out chrome.
+        const signIn = screen.getByText('component.landing.navbar.sign_in')
+        const logo = signIn.previousElementSibling as HTMLElement
+        expect(logo).not.toBeNull()
+        await userEvent.click(logo)
+        expect(assignSpy).toHaveBeenCalledWith('https://decentraland.org')
+      } finally {
+        Object.defineProperty(window, 'location', { configurable: true, value: original })
+      }
+    })
   })
 
   describe('when the user is signed in', () => {
@@ -157,6 +188,63 @@ describe('DownloadLayout', () => {
       render(<DownloadLayout title={TITLE} />)
       await waitFor(() => expect(screen.getByTestId('wearable-preview')).toBeInTheDocument())
     })
+
+    it('should set an accessible title on the preview iframe once it is present in the container', async () => {
+      // The ref callback wires the container; once the WearablePreview iframe is
+      // rendered the effect's `existing` branch runs and labels it for a11y.
+      mockUseInView.mockReturnValue({ ref: jest.fn(), inView: true } as unknown as ReturnType<typeof useInView>)
+      render(<DownloadLayout title={TITLE} />)
+      await waitFor(() => expect(screen.getByTestId('wearable-preview')).toHaveAttribute('title', 'page.download.avatar_preview'))
+    })
+
+    it('should label an iframe that the WearablePreview injects asynchronously via MutationObserver', async () => {
+      // Render the preview wrapper but with NO iframe yet, then inject one into
+      // the container after mount so the MutationObserver branch (not the
+      // synchronous `existing` branch) sets the title.
+      // eslint-disable-next-line @typescript-eslint/no-require-imports
+      const wpModule = require('decentraland-ui2/dist/components/WearablePreview/WearablePreview')
+      const originalPreview = wpModule.WearablePreview
+      // Replace the preview with an empty container so no iframe exists initially.
+      wpModule.WearablePreview = () => <div data-testid="empty-preview" />
+      try {
+        mockUseInView.mockReturnValue({ ref: jest.fn(), inView: true } as unknown as ReturnType<typeof useInView>)
+        const { container } = render(<DownloadLayout title={TITLE} />)
+        await waitFor(() => expect(screen.getByTestId('empty-preview')).toBeInTheDocument())
+
+        const host = screen.getByTestId('empty-preview').parentElement as HTMLElement
+        const injected = document.createElement('iframe')
+        host.appendChild(injected)
+
+        await waitFor(() => expect(injected).toHaveAttribute('title', 'page.download.avatar_preview'))
+        expect(container).toBeTruthy()
+      } finally {
+        wpModule.WearablePreview = originalPreview
+      }
+    })
+
+    it('should label an iframe nested inside an element the WearablePreview injects', async () => {
+      // Same MutationObserver path, but the added node is a wrapper element that
+      // contains the iframe rather than the iframe itself.
+      // eslint-disable-next-line @typescript-eslint/no-require-imports
+      const wpModule = require('decentraland-ui2/dist/components/WearablePreview/WearablePreview')
+      const originalPreview = wpModule.WearablePreview
+      wpModule.WearablePreview = () => <div data-testid="empty-preview-nested" />
+      try {
+        mockUseInView.mockReturnValue({ ref: jest.fn(), inView: true } as unknown as ReturnType<typeof useInView>)
+        render(<DownloadLayout title={TITLE} />)
+        await waitFor(() => expect(screen.getByTestId('empty-preview-nested')).toBeInTheDocument())
+
+        const host = screen.getByTestId('empty-preview-nested').parentElement as HTMLElement
+        const wrapper = document.createElement('div')
+        const nestedIframe = document.createElement('iframe')
+        wrapper.appendChild(nestedIframe)
+        host.appendChild(wrapper)
+
+        await waitFor(() => expect(nestedIframe).toHaveAttribute('title', 'page.download.avatar_preview'))
+      } finally {
+        wpModule.WearablePreview = originalPreview
+      }
+    })
   })
 
   describe('when the Jump In link is clicked', () => {

src/components/Reels/Metadata/UserMetadata.spec.tsx

@@ -83,6 +83,39 @@ describe('UserMetadata', () => {
     expect(trackMock).toHaveBeenCalledWith('Reels Show Wearables', { userAddress: '0xa' })
   })
 
+  it('should track the click, prevent default and open the profile modal on a plain left-click', () => {
+    render(<UserMetadata user={baseUser} isFirst={true} />)
+    const link = screen.getByText('alice').closest('a') as HTMLAnchorElement
+
+    const prevented = !fireEvent.click(link, { button: 0 })
+
+    expect(trackMock).toHaveBeenCalledWith('Reels Click Profile', {
+      userAddress: '0xa',
+      legacyProfileUrl: 'https://profile/0xa'
+    })
+    expect(openProfileMock).toHaveBeenCalledWith('0xa')
+    expect(prevented).toBe(true)
+  })
+
+  it('should let modifier clicks fall through so the profile can open in a new tab', () => {
+    render(<UserMetadata user={baseUser} isFirst={true} />)
+    const link = screen.getByText('alice').closest('a') as HTMLAnchorElement
+
+    fireEvent.click(link, { button: 0, metaKey: true })
+
+    // Tracking still fires, but navigation is left to the browser.
+    expect(trackMock).toHaveBeenCalledWith('Reels Click Profile', {
+      userAddress: '0xa',
+      legacyProfileUrl: 'https://profile/0xa'
+    })
+    expect(openProfileMock).not.toHaveBeenCalled()
+  })
+
+  it('should render a static name without a link when the user has no address', () => {
+    render(<UserMetadata user={{ ...baseUser, userAddress: '' }} isFirst={true} />)
+    expect(screen.getByText('alice').closest('a')).toBeNull()
+  })
+
   it('should render NoWearables placeholder when wearablesParsed is empty', () => {
     render(<UserMetadata user={baseUser} isFirst={true} initialWearableVisibility={true} />)
     expect(screen.getByText('component.reels.metadata.no_wearable')).toBeInTheDocument()

src/components/profile/EditProfileButton/EditProfileButton.styled.spec.tsx

@@ -0,0 +1,22 @@
+import { createElement } from 'react'
+import { render } from '@testing-library/react'
+import { EditButton, EditButtonIcon } from './EditProfileButton.styled'
+
+// Drive the real `styled()` style callbacks through the shared shim so the
+// `EditButton`/`EditButtonIcon` definition bodies (including the responsive
+// `breakpoints.down('md')` override) execute for coverage.
+jest.mock('decentraland-ui2', () => jest.requireActual('../../../__test-utils__/styledMock'))
+
+describe('EditProfileButton.styled', () => {
+  it('should render the edit CTA styled button forwarding its children', () => {
+    const { getByText } = render(createElement(EditButton, {}, 'Edit'))
+
+    expect(getByText('Edit')).toBeInTheDocument()
+  })
+
+  it('should render the pencil icon slot as an inline-flex span wrapper', () => {
+    const { getByText } = render(createElement(EditButtonIcon, null, '✎'))
+
+    expect(getByText('✎')).toBeInTheDocument()
+  })
+})

src/components/profile/ProfileHeader/ProfileHeader.helpers.spec.tsx

@@ -0,0 +1,98 @@
+import { getFriendButtonConfig } from './ProfileHeader.helpers'
+import type { FriendButtonConfig } from './ProfileHeader.helpers'
+
+describe('when getting the friend button config', () => {
+  let config: FriendButtonConfig
+
+  afterEach(() => {
+    jest.resetAllMocks()
+  })
+
+  describe('and a friend request has been sent', () => {
+    beforeEach(() => {
+      config = getFriendButtonConfig('request_sent')
+    })
+
+    it('should offer the cancel action', () => {
+      expect(config.action).toBe('cancel')
+    })
+
+    it('should use the request-sent label', () => {
+      expect(config.labelKey).toBe('profile.header.request_sent')
+    })
+
+    it('should expose an icon', () => {
+      expect(config.icon).toBeDefined()
+    })
+  })
+
+  describe('and a friend request has been received', () => {
+    beforeEach(() => {
+      config = getFriendButtonConfig('request_received')
+    })
+
+    it('should offer the accept action', () => {
+      expect(config.action).toBe('accept')
+    })
+
+    it('should use the add-friend label', () => {
+      expect(config.labelKey).toBe('profile.header.add_friend')
+    })
+  })
+
+  describe('and the friendship is accepted', () => {
+    beforeEach(() => {
+      config = getFriendButtonConfig('accepted')
+    })
+
+    it('should offer the remove action', () => {
+      expect(config.action).toBe('remove')
+    })
+
+    it('should use the remove-friend label', () => {
+      expect(config.labelKey).toBe('profile.header.remove_friend')
+    })
+  })
+
+  describe('and there is no relationship yet', () => {
+    beforeEach(() => {
+      config = getFriendButtonConfig('none')
+    })
+
+    it('should default to the request action', () => {
+      expect(config.action).toBe('request')
+    })
+
+    it('should use the add-friend label', () => {
+      expect(config.labelKey).toBe('profile.header.add_friend')
+    })
+  })
+
+  describe('and the user is blocked', () => {
+    beforeEach(() => {
+      config = getFriendButtonConfig('blocked')
+    })
+
+    it('should fall through to the request action', () => {
+      expect(config.action).toBe('request')
+    })
+
+    it('should use the add-friend label', () => {
+      expect(config.labelKey).toBe('profile.header.add_friend')
+    })
+  })
+
+  describe('and the status is undefined', () => {
+    beforeEach(() => {
+      config = getFriendButtonConfig(undefined)
+    })
+
+    it('should fall through to the request action', () => {
+      expect(config.action).toBe('request')
+    })
+
+    it('should use the add-friend label', () => {
+      expect(config.labelKey).toBe('profile.header.add_friend')
+    })
+  })
+})