import React from 'react'; import ReactDOMServer from 'react-dom/server'; import { Col, Row } from '..'; import { render, screen } from '../../../tests/utils'; vi.mock('../../_util/styleChecker', () => ({ canUseDocElement: () => true, isStyleSupport: () => true, detectFlexGapSupported: () => true, })); describe('Grid.Gap', () => { it('should not have `row-gap: 0px` style', () => { render( , ); expect(screen.getByRole('row').style.rowGap).toBe(''); }); it('should use gap', () => { const { container } = render( , ); expect((container.querySelector('.ant-row') as HTMLElement)!.style.marginLeft).toEqual('-8px'); expect((container.querySelector('.ant-row') as HTMLElement)!.style.marginRight).toEqual('-8px'); expect((container.querySelector('.ant-row') as HTMLElement)!.style.rowGap).toEqual('8px'); }); it('not break ssr', () => { const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const Demo = () => ( ); const div = document.createElement('div'); const ssrTxt = ReactDOMServer.renderToString(); div.innerHTML = ssrTxt; const { unmount } = render(, { container: div, hydrate: true }); expect(warnSpy).not.toHaveBeenCalled(); warnSpy.mockRestore(); unmount(); }); });