Is it possible to run testing-library tests against components which use the splitter?
For example, consider the following test:
import { render, screen } from "@testing-library/react";
import Splitter, { SplitDirection } from '@devbookhq/splitter'
// ResizeObserver is required by DevbookHQ's Splitter component.
// Mock it by using the resize-observer-polyfill installed here as a dev dependency.
global.ResizeObserver = require("resize-observer-polyfill");
describe("Splitter", () => {
it("works as expected", () => {
render(
<Splitter direction={SplitDirection.Vertical}>
<div>Tile 1</div>
<div>Tile 2</div>
</Splitter>
);
expect(screen.getByText(/Tile 1/i)).toBeInTheDocument();
});
});When the above test is executed, it fails as the render function generates the following HTML, which is missing the two tile divs:
<body>
<div>
<div
class="__dbk__container Vertical"
/>
</div>
</body>
Is it possible to run
testing-librarytests against components which use the splitter?For example, consider the following test:
When the above test is executed, it fails as the render function generates the following HTML, which is missing the two tile divs: