test(core): setup @testing-library/jest-dom and add component test for Box

[MH4GF]

Description

This PR will set up @testing-library/jest-dom to be able to use toBeInTheDocument(), etc. in component testing.

Motivation

I was going to try this issue #256, but first I wanted to be able to easily assert that existing usage was not broken.

How was it tested

As a sample test, I have added the test code for the Box component.
If this plan is acceptable, I will expand the test code for other components 👍🏻

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
kuma-ui-website	❌ Failed (Inspect)			Aug 8, 2023 10:55pm

[changeset-bot]

🦋 Changeset detected

Latest commit: 664ad09

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 11 packages

Name	Type
@kuma-ui/core	Patch
@kuma-ui/babel-plugin	Patch
@kuma-ui/compiler	Patch
@kuma-ui/next-plugin	Patch
next-app-router	Patch
next	Patch
react-vite-example	Patch
webpack	Patch
website	Patch
@kuma-ui/vite	Patch
@kuma-ui/webpack-plugin	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 664ad09:

Sandbox	Source
React	Configuration
React Typescript	Configuration

[MH4GF]

ref: testing-library/jest-dom#439 (comment)

[kotarella1110]

Thank you! LGTM 🎉

[kotarella1110]

@MH4GF Please add a changeset. You can add it from the following link 🙏🏻

[MH4GF]

@kotarella1110 Oh, I added it! 664ad09

[poteboy]

@MH4GF
Thanks for the PR! Could you modify the tests in spacer.test.tsx to use toHaveStyle instead of calculating the style from getComputedStyle, especially now that we have an extended matcher from testing-library/jest-dom?

[MH4GF]

@poteboy Of course! But since the scope of this PR is larger, can I use a different PR?
In addition to modifying spacer.test.tsx, I also wanted to move the cleanup() to vitest.setup.ts:

kuma-ui/packages/core/src/components/Spacer/spacer.test.tsx

Lines 8 to 10 in 9a565d7

	beforeEach(() => {
	cleanup();
	});