@faststore/core 4.6.0-dev.0 → 4.6.0-dev.2

package/test/components/skeletons/ProductGridSkeleton.browser.test.tsx

@@ -0,0 +1,32 @@
+/**
+ * @vitest-environment jsdom
+ */
+
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+
+vi.mock('src/components/skeletons/ProductCardSkeleton', () => ({
+  __esModule: true,
+  default: () => <div data-testid="product-card-skeleton" />,
+}))
+
+import ProductGridSkeleton from '../../../src/components/skeletons/ProductGridSkeleton/ProductGridSkeleton'
+
+describe('ProductGridSkeleton', () => {
+  it('renders the requested number of placeholder cards', () => {
+    render(<ProductGridSkeleton loading count={4} />)
+
+    expect(screen.getAllByTestId('product-card-skeleton')).toHaveLength(4)
+  })
+
+  it('renders children when not loading', () => {
+    render(
+      <ProductGridSkeleton loading={false}>
+        <div data-testid="grid-content">products</div>
+      </ProductGridSkeleton>
+    )
+
+    expect(screen.getByTestId('grid-content')).toBeTruthy()
+    expect(screen.queryByTestId('product-card-skeleton')).toBeNull()
+  })
+})

package/test/components/templates/SearchPage/SearchWrapper.browser.test.tsx

@@ -0,0 +1,137 @@
+/**
+ * @vitest-environment jsdom
+ */
+
+import React from 'react'
+import { act, render, waitFor } from '@testing-library/react'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+const replace = vi.fn()
+const resetInfiniteScroll = vi.fn()
+const useProductGalleryQuery = vi.fn()
+
+vi.mock('next/router', () => ({
+  useRouter: () => ({ replace }),
+}))
+
+vi.mock('@faststore/sdk', () => ({
+  useSearch: () => ({
+    state: { term: 'refil', sort: 'score_desc', selectedFacets: [] },
+    pages: [0],
+    resetInfiniteScroll,
+  }),
+}))
+
+vi.mock('discovery.config', () => ({
+  __esModule: true,
+  default: {
+    experimental: { enableSearchSSR: false },
+    seo: { search: { bodyH1: 'Showing results for:' } },
+  },
+}))
+
+vi.mock('src/sdk/product/useProductGalleryQuery', () => ({
+  useProductGalleryQuery: (...args: unknown[]) =>
+    useProductGalleryQuery(...args),
+}))
+
+vi.mock('src/components/cms/RenderSections', () => ({
+  __esModule: true,
+  default: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+}))
+
+vi.mock('src/sdk/overrides/PageProvider', () => ({
+  __esModule: true,
+  default: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+}))
+
+vi.mock('src/components/templates/SearchPage/EmptySearch', () => ({
+  __esModule: true,
+  default: () => <div data-testid="empty-search" />,
+}))
+
+vi.mock('src/components/templates/SearchPage/SearchPage', () => ({
+  __esModule: true,
+  default: () => <div data-testid="search-page" />,
+}))
+
+import SearchWrapper from 'src/components/templates/SearchPage/SearchWrapper'
+
+describe('SearchWrapper Intelligent Search redirect', () => {
+  beforeEach(() => {
+    replace.mockClear()
+    resetInfiniteScroll.mockClear()
+  })
+
+  it('calls router.replace once from an effect when redirect.url is present', async () => {
+    useProductGalleryQuery.mockReturnValue({
+      data: { redirect: { url: '/office' }, search: { products: null } },
+    })
+
+    await act(async () => {
+      render(
+        <SearchWrapper
+          itemsPerPage={12}
+          searchContentType={{} as never}
+          serverData={{ searchTerm: 'refil' } as never}
+        />
+      )
+    })
+
+    await waitFor(() => {
+      expect(replace).toHaveBeenCalledTimes(1)
+      expect(replace).toHaveBeenCalledWith('/office')
+    })
+  })
+
+  it('does not call router.replace again for the same redirect url on rerender', async () => {
+    useProductGalleryQuery.mockReturnValue({
+      data: { redirect: { url: '/office' }, search: { products: null } },
+    })
+
+    const { rerender } = render(
+      <SearchWrapper
+        itemsPerPage={12}
+        searchContentType={{} as never}
+        serverData={{ searchTerm: 'refil' } as never}
+      />
+    )
+
+    await waitFor(() => {
+      expect(replace).toHaveBeenCalledTimes(1)
+    })
+
+    await act(async () => {
+      rerender(
+        <SearchWrapper
+          itemsPerPage={12}
+          searchContentType={{} as never}
+          serverData={{ searchTerm: 'refil' } as never}
+        />
+      )
+    })
+
+    expect(replace).toHaveBeenCalledTimes(1)
+  })
+
+  it('does not redirect when there is no redirect url', async () => {
+    useProductGalleryQuery.mockReturnValue({
+      data: {
+        redirect: null,
+        search: { products: { pageInfo: { totalCount: 12 } } },
+      },
+    })
+
+    await act(async () => {
+      render(
+        <SearchWrapper
+          itemsPerPage={12}
+          searchContentType={{} as never}
+          serverData={{ searchTerm: 'desk' } as never}
+        />
+      )
+    })
+
+    expect(replace).not.toHaveBeenCalled()
+  })
+})

package/test/components/ui/ProductGallery/GalleryPageHeightLock.browser.test.tsx

@@ -0,0 +1,230 @@
+/**
+ * @vitest-environment jsdom
+ */
+
+import { act, render, screen } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+vi.mock('@faststore/sdk', () => ({
+  useSearch: () => ({
+    state: {
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+    },
+  }),
+}))
+
+import GalleryPageHeightLock, {
+  buildGalleryPageHeightKey,
+  getGalleryViewportBucket,
+  getReservedGalleryHeight,
+  readGalleryPageHeight,
+  resolveReservedGalleryHeight,
+} from 'src/components/ui/ProductGallery/GalleryPageHeightLock'
+
+describe('GalleryPageHeightLock helpers', () => {
+  beforeEach(() => {
+    sessionStorage.clear()
+  })
+
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  it('maps viewport widths to layout buckets', () => {
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 390,
+    })
+    expect(getGalleryViewportBucket()).toBe('mobile')
+
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 700,
+    })
+    expect(getGalleryViewportBucket()).toBe('tablet')
+
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 1024,
+    })
+    expect(getGalleryViewportBucket()).toBe('notebook')
+
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 1440,
+    })
+    expect(getGalleryViewportBucket()).toBe('desktop')
+  })
+
+  it('builds stable storage keys that include viewport', () => {
+    const keyA = buildGalleryPageHeightKey(2, {
+      path: '/office',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+      viewport: 'desktop',
+    })
+    const keyB = buildGalleryPageHeightKey(2, {
+      path: '/office',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+      viewport: 'mobile',
+    })
+
+    expect(keyA).toMatch(/^__fs_gallery_page_h_p2_desktop_/)
+    expect(keyB).toMatch(/^__fs_gallery_page_h_p2_mobile_/)
+    expect(keyA).not.toBe(keyB)
+  })
+
+  it('keeps page and viewport distinct for long path + facets', () => {
+    // Truncating a sanitized JSON at 180 chars used to drop page/viewport and
+    // collide mobile↔desktop (and page 0↔1) on filtered PLPs.
+    const search = {
+      path: '/eletronicos/celulares-e-smartphones',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [
+        { key: 'brand', value: 'samsung' },
+        { key: 'price', value: '1000-to-2000' },
+      ],
+    }
+
+    const mobile = buildGalleryPageHeightKey(0, {
+      ...search,
+      viewport: 'mobile',
+    })
+    const desktop = buildGalleryPageHeightKey(0, {
+      ...search,
+      viewport: 'desktop',
+    })
+    const page1 = buildGalleryPageHeightKey(1, {
+      ...search,
+      viewport: 'desktop',
+    })
+
+    expect(mobile).not.toBe(desktop)
+    expect(desktop).not.toBe(page1)
+    expect(mobile).toContain('_mobile_')
+    expect(desktop).toContain('_desktop_')
+    expect(page1).toMatch(/^__fs_gallery_page_h_p1_/)
+  })
+
+  it('reads and sums reserved gallery heights', () => {
+    const search = {
+      path: '/office',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+      viewport: 'desktop',
+    }
+    const key0 = buildGalleryPageHeightKey(0, search)
+    const key1 = buildGalleryPageHeightKey(1, search)
+    sessionStorage.setItem(key0, '800')
+    sessionStorage.setItem(key1, '750')
+
+    expect(readGalleryPageHeight(key0)).toBe(800)
+    expect(readGalleryPageHeight('missing')).toBeNull()
+    expect(getReservedGalleryHeight([0, 1, 2], search)).toBe(1550)
+  })
+
+  it('ignores invalid stored heights', () => {
+    sessionStorage.setItem('bad-key', '0')
+    expect(readGalleryPageHeight('bad-key')).toBeNull()
+    sessionStorage.setItem('nan-key', 'nope')
+    expect(readGalleryPageHeight('nan-key')).toBeNull()
+  })
+
+  it('resolveReservedGalleryHeight is zero once products have loaded', () => {
+    const search = {
+      path: '/office',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+      viewport: 'desktop',
+    }
+    sessionStorage.setItem(buildGalleryPageHeightKey(0, search), '800')
+    expect(resolveReservedGalleryHeight(true, [0], search)).toBe(0)
+    expect(resolveReservedGalleryHeight(false, [0], search)).toBe(800)
+  })
+})
+
+describe('GalleryPageHeightLock', () => {
+  beforeEach(() => {
+    sessionStorage.clear()
+    Object.defineProperty(window, 'innerWidth', {
+      configurable: true,
+      value: 1440,
+    })
+  })
+
+  it('applies minHeight while skeleton is showing when a height was saved', async () => {
+    const key = buildGalleryPageHeightKey(0, {
+      path: '/',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+      viewport: 'desktop',
+    })
+    // Component uses window.location.pathname — jsdom default is "/"
+    sessionStorage.setItem(key, '640')
+
+    const { container } = render(
+      <GalleryPageHeightLock page={0}>
+        <div data-testid="skeleton">loading</div>
+      </GalleryPageHeightLock>
+    )
+
+    const lock = container.querySelector(
+      '[data-fs-gallery-page-height-lock]'
+    ) as HTMLElement
+
+    // Height is applied after mount (hydration-safe).
+    await act(async () => {
+      await Promise.resolve()
+    })
+
+    expect(lock.style.minHeight).toBe('640px')
+    expect(screen.getByTestId('skeleton')).toBeTruthy()
+  })
+
+  it('releases minHeight once product cards are mounted', async () => {
+    const key = buildGalleryPageHeightKey(0, {
+      path: '/',
+      term: null,
+      sort: 'score_desc',
+      selectedFacets: [],
+      viewport: 'desktop',
+    })
+    sessionStorage.setItem(key, '640')
+
+    const { container, rerender } = render(
+      <GalleryPageHeightLock page={0}>
+        <div data-testid="skeleton">loading</div>
+      </GalleryPageHeightLock>
+    )
+
+    await act(async () => {
+      await Promise.resolve()
+    })
+
+    const lock = container.querySelector(
+      '[data-fs-gallery-page-height-lock]'
+    ) as HTMLElement
+    expect(lock.style.minHeight).toBe('640px')
+
+    await act(async () => {
+      rerender(
+        <GalleryPageHeightLock page={0}>
+          <div data-fs-product-card data-testid="card">
+            Product
+          </div>
+        </GalleryPageHeightLock>
+      )
+    })
+
+    expect(lock.style.minHeight).toBe('')
+  })
+})

package/test/sdk/cart/waitForSessionValidated.test.ts

@@ -0,0 +1,96 @@
+import { createBaseStore } from '@faststore/sdk'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import {
+  SESSION_VALIDATION_WAIT_MS,
+  waitForSessionValidated,
+} from '../../../src/sdk/cart/waitForSessionValidated'
+
+describe('waitForSessionValidated', () => {
+  afterEach(() => {
+    vi.useRealTimers()
+  })
+
+  it('resolves immediately when session was already validated', async () => {
+    const store = createBaseStore(true)
+
+    await expect(waitForSessionValidated(store)).resolves.toBeUndefined()
+  })
+
+  it('resolves when session becomes validated after subscribe', async () => {
+    const store = createBaseStore(false)
+
+    const pending = waitForSessionValidated(store, 5_000)
+    store.set(true)
+
+    await expect(pending).resolves.toBeUndefined()
+  })
+
+  it('ignores subscribe callbacks while validated is still false', async () => {
+    vi.useFakeTimers()
+    const listeners: Array<(value: boolean) => void> = []
+    const store = {
+      read: vi.fn(() => false),
+      readInitial: vi.fn(() => false),
+      subscribe: vi.fn((listener: (value: boolean) => void) => {
+        listeners.push(listener)
+        return () => {
+          const index = listeners.indexOf(listener)
+          if (index >= 0) {
+            listeners.splice(index, 1)
+          }
+        }
+      }),
+      set: vi.fn(),
+    }
+
+    const pending = waitForSessionValidated(store, SESSION_VALIDATION_WAIT_MS)
+
+    // Emit false — should not resolve yet
+    for (const listener of listeners) {
+      listener(false)
+    }
+
+    await vi.advanceTimersByTimeAsync(SESSION_VALIDATION_WAIT_MS)
+    await expect(pending).resolves.toBeUndefined()
+  })
+
+  it('resolves on timeout when session never validates', async () => {
+    vi.useFakeTimers()
+    const store = createBaseStore(false)
+
+    const pending = waitForSessionValidated(store, SESSION_VALIDATION_WAIT_MS)
+
+    await vi.advanceTimersByTimeAsync(SESSION_VALIDATION_WAIT_MS)
+
+    await expect(pending).resolves.toBeUndefined()
+  })
+
+  it('resolves the race when validation finishes between read and subscribe', async () => {
+    let current = false
+    const listeners: Array<(value: boolean) => void> = []
+
+    const store = {
+      read: vi.fn(() => {
+        // First read: not validated. Second read (post-subscribe): validated.
+        const value = current
+        current = true
+        return value
+      }),
+      readInitial: vi.fn(() => false),
+      subscribe: vi.fn((listener: (value: boolean) => void) => {
+        listeners.push(listener)
+        return () => {
+          const index = listeners.indexOf(listener)
+          if (index >= 0) {
+            listeners.splice(index, 1)
+          }
+        }
+      }),
+      set: vi.fn(),
+    }
+
+    await expect(waitForSessionValidated(store, 5_000)).resolves.toBeUndefined()
+    expect(store.subscribe).toHaveBeenCalledTimes(1)
+    expect(store.read).toHaveBeenCalledTimes(2)
+  })
+})

package/test/sdk/session/syncSalesChannelFromOrderForm.test.ts

@@ -0,0 +1,125 @@
+import { describe, expect, it, vi } from 'vitest'
+import type { Session } from '@faststore/sdk'
+import { syncSalesChannelFromOrderForm } from '../../../src/sdk/session/syncSalesChannelFromOrderForm'
+
+const baseSession = (
+  salesChannel: string,
+  explicit = true,
+  channelOverride?: string | null
+): Session => ({
+  currency: { code: 'BRL', symbol: 'R$' },
+  locale: 'pt-BR',
+  country: 'BRA',
+  channel:
+    channelOverride !== undefined
+      ? channelOverride
+      : JSON.stringify({
+          salesChannel,
+          regionId: '',
+          hasOnlyDefaultSalesChannel: !explicit,
+        }),
+  deliveryMode: null,
+  addressType: null,
+  city: null,
+  postalCode: null,
+  geoCoordinates: null,
+  person: null,
+  b2b: null,
+  marketingData: null,
+  refreshAfter: null,
+})
+
+describe('syncSalesChannelFromOrderForm', () => {
+  it('updates session channel silently when SC diverges', () => {
+    const setSilent = vi.fn()
+    const synced = syncSalesChannelFromOrderForm(
+      '2',
+      () => baseSession('1', false),
+      setSilent
+    )
+
+    expect(synced).toBe(true)
+    expect(setSilent).toHaveBeenCalledTimes(1)
+    const next = setSilent.mock.calls[0][0] as Session
+    expect(JSON.parse(next.channel ?? '{}')).toMatchObject({
+      salesChannel: '2',
+      hasOnlyDefaultSalesChannel: false,
+    })
+  })
+
+  it('is a no-op when SC already matches', () => {
+    const setSilent = vi.fn()
+    const synced = syncSalesChannelFromOrderForm(
+      '2',
+      () => baseSession('2'),
+      setSilent
+    )
+
+    expect(synced).toBe(false)
+    expect(setSilent).not.toHaveBeenCalled()
+  })
+
+  it('is a no-op when adopted SC is missing', () => {
+    const setSilent = vi.fn()
+    expect(
+      syncSalesChannelFromOrderForm(null, () => baseSession('1'), setSilent)
+    ).toBe(false)
+    expect(
+      syncSalesChannelFromOrderForm('', () => baseSession('1'), setSilent)
+    ).toBe(false)
+    expect(setSilent).not.toHaveBeenCalled()
+  })
+
+  it('resets non-object channel JSON before adopting SC', () => {
+    const setSilent = vi.fn()
+
+    for (const invalid of ['null', '[]', '"text"', '0', 'false']) {
+      setSilent.mockClear()
+      const synced = syncSalesChannelFromOrderForm(
+        '2',
+        () => baseSession('1', true, invalid),
+        setSilent
+      )
+
+      expect(synced).toBe(true)
+      expect(JSON.parse(setSilent.mock.calls[0][0].channel)).toMatchObject({
+        salesChannel: '2',
+        hasOnlyDefaultSalesChannel: false,
+      })
+    }
+  })
+
+  it('resets malformed channel JSON before adopting SC', () => {
+    const setSilent = vi.fn()
+    const synced = syncSalesChannelFromOrderForm(
+      '2',
+      () => baseSession('1', true, '{'),
+      setSilent
+    )
+
+    expect(synced).toBe(true)
+    expect(JSON.parse(setSilent.mock.calls[0][0].channel)).toMatchObject({
+      salesChannel: '2',
+      hasOnlyDefaultSalesChannel: false,
+    })
+  })
+
+  it('ignores object-valued salesChannel when comparing', () => {
+    const setSilent = vi.fn()
+    const synced = syncSalesChannelFromOrderForm(
+      '2',
+      () =>
+        baseSession(
+          '1',
+          true,
+          JSON.stringify({ salesChannel: { nested: true } })
+        ),
+      setSilent
+    )
+
+    expect(synced).toBe(true)
+    expect(JSON.parse(setSilent.mock.calls[0][0].channel).salesChannel).toBe(
+      '2'
+    )
+  })
+})