Skip to content

Commit

Permalink
Cleanup (#1909)
Browse files Browse the repository at this point in the history
  • Loading branch information
bmingles committed Apr 11, 2024
1 parent ae099ca commit 342b24c
Showing 1 changed file with 19 additions and 24 deletions.
43 changes: 19 additions & 24 deletions packages/code-studio/src/styleguide/StyleGuide.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,41 +9,36 @@ import StyleGuide from './StyleGuide';
window.HTMLElement.prototype.scroll = jest.fn();
window.HTMLElement.prototype.scrollIntoView = jest.fn();

/*
* React Spectrum `useVirtualizerItem` depends on `scrollWidth` and `scrollHeight`.
* Mocking these to avoid React "Maximum update depth exceeded" errors.
* https://github.com/adobe/react-spectrum/blob/0b2a838b36ad6d86eee13abaf68b7e4d2b4ada6c/packages/%40react-aria/virtualizer/src/useVirtualizerItem.ts#L49C3-L49C60
/**
* Mock a dimension property of a ListView element.
*/
function mockListViewDimension(value: number) {
return function getDimension() {
const isSpectrumListView =
this instanceof HTMLElement &&
this.className.includes('_react-spectrum-ListView');
function mockListViewDimension(propName: keyof HTMLElement, value: number) {
jest
.spyOn(window.HTMLElement.prototype, propName, 'get')
.mockImplementation(function getDimension() {
const isSpectrumListView =
this instanceof HTMLElement &&
this.className.includes('_react-spectrum-ListView');

// For non ListView, just return zero which is the default value anyway.
return isSpectrumListView === true ? value : 0;
};
// For non ListView, just return zero which is the default value anyway.
return isSpectrumListView === true ? value : 0;
});
}

describe('<StyleGuide /> mounts', () => {
test('h1 text of StyleGuide renders', () => {
// Provide a non-null array to ThemeProvider to tell it to initialize
const customThemes: ThemeData[] = [];

// React Spectrum `useVirtualizerItem` depends on `scrollWidth` and `scrollHeight`.
// Mocking these to avoid React "Maximum update depth exceeded" errors.
// https://github.com/adobe/react-spectrum/blob/0b2a838b36ad6d86eee13abaf68b7e4d2b4ada6c/packages/%40react-aria/virtualizer/src/useVirtualizerItem.ts#L49C3-L49C60
// From preview docs: https://reactspectrum.blob.core.windows.net/reactspectrum/726a5e8f0ed50fc8d98e39c74bd6dfeb3660fbdf/docs/react-spectrum/testing.html#virtualized-components
// The virtualizer will now think it has a visible area of 1000px x 1000px and that the items within it are 40px x 40px
jest
.spyOn(window.HTMLElement.prototype, 'clientWidth', 'get')
.mockImplementation(mockListViewDimension(1000));
jest
.spyOn(window.HTMLElement.prototype, 'clientHeight', 'get')
.mockImplementation(mockListViewDimension(1000));
jest
.spyOn(window.HTMLElement.prototype, 'scrollHeight', 'get')
.mockImplementation(mockListViewDimension(40));
jest
.spyOn(window.HTMLElement.prototype, 'scrollWidth', 'get')
.mockImplementation(mockListViewDimension(40));
mockListViewDimension('clientWidth', 1000);
mockListViewDimension('clientHeight', 1000);
mockListViewDimension('scrollHeight', 40);
mockListViewDimension('scrollWidth', 40);

expect(() =>
render(
Expand Down

0 comments on commit 342b24c

Please sign in to comment.