Progress bar tests failing - selector not finding element

[zubeyralmaho]

Description

Two tests in presentationWrapper.spec.js are failing because the progressBar selector cannot find the element. The tests have been marked as it.skip as a temporary workaround.

Failing tests:

• Should Render Progress Bar if there is more than 2 pages
• Should Change ProgressBar Width Property Based on currentPage and pageCount Props

Root Cause

The issue stems from a mismatch between how the test passes props and how PresentationContext initializes the pageCount state.

In the test:

mountWithProviders(<PresentationWrapper />, { presentationProps: { pageCount: 4 } });

In PresentationContext.js:

const presentationStore = props => {
  return createStore(set => ({
    pageCount: 0,  // Always initializes to 0, ignores props.pageCount
    // ...
  }));
};

// pageCount is only updated via useEffect from pages.length
useEffect(() => {
  const { setPageCount } = storeRef.current.getState();
  setPageCount(pages.length);  // Gets length from PropProvider's pages array
}, [pages]);

The pageCount prop passed to PresentationProvider is ignored. Instead, pageCount is derived from pages.length in PropProvider.

Expected Behavior

Tests should be able to set pageCount directly via props for testing purposes, OR tests should pass a pages array with the desired length to propProps.

Suggested Fix

Option 1: Update presentationStore to accept initial pageCount:

const presentationStore = props => {
  return createStore(set => ({
    pageCount: props.pageCount || 0,
    // ...
  }));
};

Option 2: Update tests to use propProps instead:

const pages = Array(4).fill({ id: 'page', items: [] });
mountWithProviders(<PresentationWrapper />, { propProps: { pages } });

Affected Files

• src/__tests__/unit-tests/Presentation/presentationWrapper.spec.js
• src/contexts/PresentationContext.js

Environment

• Node.js: 18+
• Jest: 26.6.3
• Enzyme: 3.11.0