@zohodesk/components
Version:
Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development
90 lines • 2.8 kB
JavaScript
import React from 'react';
import { render, fireEvent, within, waitFor } from '@testing-library/react';
import Card, { CardContent } from "../Card";
describe('Card', () => {
test('rendering the defult props', () => {
const {
asFragment
} = render( /*#__PURE__*/React.createElement(Card, null));
expect(asFragment()).toMatchSnapshot();
});
test('should trigger fetch, when scroll to the bottom of the card while isRecentOnBottom = false', async () => {
const mockGetNextOptions = jest.fn(() => {
return new Promise(resolve => {
resolve();
});
});
const {
getByTestId,
asFragment
} = render( /*#__PURE__*/React.createElement(Card, {
from: 0,
limit: 10,
fetchData: mockGetNextOptions
}, /*#__PURE__*/React.createElement(CardContent, {
dataId: "scrollToBottomCardContent"
}, /*#__PURE__*/React.createElement("div", null, "Hello Zam"))));
const cardContent = getByTestId('scrollToBottomCardContent');
Object.defineProperty(cardContent, 'scrollHeight', {
value: 1000,
writable: true
});
Object.defineProperty(cardContent, 'clientHeight', {
value: 600,
writable: true
});
Object.defineProperty(cardContent, 'offsetHeight', {
value: 600,
writable: true
});
fireEvent.scroll(cardContent, {
target: {
scrollTop: 401
}
});
await waitFor(() => {
expect(asFragment()).toMatchSnapshot();
expect(mockGetNextOptions).toHaveBeenCalledWith(10, 40, 'down');
});
});
test('should trigger fetch, when scroll to the top of the card while scrollDirection = bottomToTop', async () => {
const mockGetNextOptions = jest.fn(() => {
return new Promise(resolve => {
resolve();
});
});
const {
getByTestId,
asFragment
} = render( /*#__PURE__*/React.createElement(Card, {
from: 0,
limit: 10,
scrollDirection: "bottomToTop",
fetchData: mockGetNextOptions
}, /*#__PURE__*/React.createElement(CardContent, {
dataId: "scrollToTopCardContent"
}, /*#__PURE__*/React.createElement("div", null, "Hello Zam"))));
const cardContent = getByTestId('scrollToTopCardContent');
Object.defineProperty(cardContent, 'scrollHeight', {
value: 1000,
writable: true
});
Object.defineProperty(cardContent, 'clientHeight', {
value: 600,
writable: true
});
Object.defineProperty(cardContent, 'offsetHeight', {
value: 600,
writable: true
});
fireEvent.scroll(cardContent, {
target: {
scrollTop: 0
}
});
await waitFor(() => {
expect(asFragment()).toMatchSnapshot();
expect(mockGetNextOptions).toHaveBeenCalledWith(10, 40, 'up');
});
});
});