test: add defaultlayout tests

src/components/Footer/Footer.jsx

@@ -4,7 +4,7 @@ import style from './Footer.module.css'
 
 function Footer () {
   return (
-    <footer className={style.footer}>
+    <footer className={style.footer} data-testid='footer'>
       <nav>
         <ul>
           <li>

src/components/Header/Header.jsx

@@ -5,7 +5,7 @@ import styles from './Header.module.css'
 
 function Header () {
   return (
-    <header className={styles.header}>
+    <header className={styles.header} data-testid='header'>
       <nav>
         <Link href='/'>Home</Link>
         <Link href='/writing'>Writing</Link>

src/layouts/DefaultLayout/DefaultLayout.test.jsx

@@ -0,0 +1,29 @@
+/* eslint-env jest */
+import { render, screen } from '@testing-library/react'
+import DefaultLayout from './DefaultLayout'
+import '@testing-library/jest-dom'
+
+describe('DefaultLayout', () => {
+  const props = {
+    children: <div>Test Content</div>
+  }
+
+  it('renders without crashing', () => {
+    render(<DefaultLayout {...props} />)
+  })
+
+  it('renders Header', () => {
+    render(<DefaultLayout {...props} />)
+    expect(screen.getByTestId('header')).toBeInTheDocument()
+  })
+
+  it('renders Footer', () => {
+    render(<DefaultLayout {...props} />)
+    expect(screen.getByTestId('footer')).toBeInTheDocument()
+  })
+
+  it('renders children correctly', () => {
+    render(<DefaultLayout {...props} />)
+    expect(screen.getByText('Test Content')).toBeInTheDocument()
+  })
+})