Ant Design Typography component doesn't fire onEllipsis event

[leobel]

I'm trying to write a test which depends on onEllipsis event. When text is rendered I should receive a callback from onEllipsis telling if it was truncated or not, see here.

• @testing-library/react version: 16.0.0
• Testing Framework and version:
  jest@29.7.0
  node v18.17.1
• DOM Environment:
  @testing-library/jest-dom@6.4.6

Relevant code or config:

it("test", async () => {
        const handleEllipsis = jest.fn();

        render(
            <div style={{ width: '100px' }}>
                <Typography.Paragraph ellipsis={{ rows: 1, onEllipsis: handleEllipsis }}>
                    This is a very long text that should be truncated by the ellipsis.
                </Typography.Paragraph>
            </div>
        );

        // Use waitFor to handle asynchronous updates
        await waitFor(() => {
            expect(handleEllipsis).toHaveBeenCalled();
        });
    })

What you did:

Testing onEllipsis event from Ant DesignTypography.Paragraph so it get trigger for each text telling whether ellipsis are active or not

What happened:

No onEllipsis event is triggered when the component is rendered.

[MatanBobi]

Hi @leobel :)
Testing sizes and layout is something that can't be done in jsdom as it has no layout engine.
I'd take an example from what AntD are doing to test this component here: https://github.com/ant-design/ant-design/blob/master/components/typography/__tests__/ellipsis.test.tsx (some mocks are needed).
I'm not sure though why you'd want to test this as this is a 3rd party component which is already tested so I would normally not test this use case.
I'm closing this as there's nothing we can do in Testing Library as this is based on your testing environment, having said that if you think this is an issue with Testing Library, please feel free to comment/re-open.