auto: PR for feat/export-bundle-phase7-perf-seo #64

Merged
jaybe merged 4 commits from feat/export-bundle-phase7-perf-seo into main 2025-11-16 01:57:42 +00:00
2 changed files with 67 additions and 6 deletions
Showing only changes of commit 0eb056e6b5 - Show all commits
@@ -0,0 +1,49 @@
import { describe, it, expect, beforeEach } from 'vitest'
import { render, screen, fireEvent, waitFor } from '@testing-library/react'
import { NextIntlClientProvider } from 'next-intl'
import BuilderClientPage from '@/components/BuilderClientPage'
declare global {
interface Window { __exportPreview?: () => { html: string } }
}
describe('BuilderClientPage robots meta UI 연동', () => {
beforeEach(() => {
window.__exportPreview = undefined
})
it('기본값에서는 robots meta가 존재하지 않는다', async () => {
render(
<NextIntlClientProvider locale="en" messages={{}}>
<BuilderClientPage />
</NextIntlClientProvider>
)
// Hero 추가(렌더 내용 명확화)
const addHeroBtn = screen.getByTestId('btn-add-hero')
addHeroBtn.click()
expect(typeof window.__exportPreview).toBe('function')
await waitFor(() => {
const out = window.__exportPreview!()
expect(out.html).not.toContain('<meta name="robots"')
})
})
it('UI 입력값이 head robots meta에 반영된다', async () => {
render(
<NextIntlClientProvider locale="en" messages={{}}>
<BuilderClientPage />
</NextIntlClientProvider>
)
const addHeroBtn = screen.getByTestId('btn-add-hero')
addHeroBtn.click()
const robotsInput = screen.getByLabelText('Robots Meta') as HTMLInputElement
fireEvent.change(robotsInput, { target: { value: 'noindex, nofollow' } })
await waitFor(() => {
const out = window.__exportPreview!()
expect(out.html).toContain('<meta name="robots" content="noindex, nofollow"')
})
})
})
+18 -6
View File
@@ -57,6 +57,7 @@ export default function BuilderClientPage() {
const [manifestDisplay, setManifestDisplay] = useState<string>('')
const [manifestThemeColor, setManifestThemeColor] = useState<string>('')
const [robotsDisallow, setRobotsDisallow] = useState<string>('')
const [robotsMeta, setRobotsMeta] = useState<string>('')
const [sheetsMode, setSheetsMode] = useState<'auto' | 'include' | 'exclude'>('auto')
const [assetPathStrategy, setAssetPathStrategy] = useState<'flat' | 'grouped'>('flat')
// Font optimization: allow toggling Google Fonts preconnect links in exported HTML
@@ -197,7 +198,7 @@ export default function BuilderClientPage() {
w.__exportPreview = () => {
try {
// Export preview with current optimization options
return exportPage(pageSchema.parse(pageData), { assetManager: buildEffectiveAm(), fontPreconnect, fontPreload, imageLoading, imageDecoding })
return exportPage(pageSchema.parse(pageData), { assetManager: buildEffectiveAm(), fontPreconnect, fontPreload, imageLoading, imageDecoding, robotsMeta: robotsMeta.trim() || undefined })
} catch {
const fixed: Page = {
...pageData,
@@ -207,12 +208,12 @@ export default function BuilderClientPage() {
spamProtection: pageData.form?.spamProtection ?? { honeypotFieldName: '_hp', minSubmitSeconds: 2 },
},
}
return exportPage(pageSchema.parse(fixed), { assetManager: buildEffectiveAm(), fontPreconnect, fontPreload, imageLoading, imageDecoding })
return exportPage(pageSchema.parse(fixed), { assetManager: buildEffectiveAm(), fontPreconnect, fontPreload, imageLoading, imageDecoding, robotsMeta: robotsMeta.trim() || undefined })
}
}
}
} catch {}
}, [pageData, am, fontPreconnect, fontPreload, imageLoading, imageDecoding, assetPathStrategy])
}, [pageData, am, fontPreconnect, fontPreload, imageLoading, imageDecoding, robotsMeta, assetPathStrategy])
const doExport = useCallback(async () => {
let valid = pageData as Page
@@ -240,8 +241,8 @@ export default function BuilderClientPage() {
}
return clone
}
// Respect font and image optimization toggles when exporting
const exported = exportPage(valid, { assetManager: buildEffectiveAm(), fontPreconnect, fontPreload, imageLoading, imageDecoding })
// Respect font, image, robots meta optimization toggles when exporting
const exported = exportPage(valid, { assetManager: buildEffectiveAm(), fontPreconnect, fontPreload, imageLoading, imageDecoding, robotsMeta: robotsMeta.trim() || undefined })
try {
if (typeof window !== 'undefined') {
const w = window as unknown as { __captureExport?: boolean; __lastExport?: { html: string; css: string; js: string } }
@@ -288,7 +289,7 @@ export default function BuilderClientPage() {
}
const zipBytes = await buildZip({ html: exported.html, css: exported.css, js: exported.js, assets, extras })
download('landing.zip', zipBytes)
}, [pageData, am, manifestName, manifestShortName, manifestStartUrl, manifestDisplay, manifestThemeColor, robotsDisallow, sheetsMode, fontPreconnect, fontPreload, imageLoading, imageDecoding, assetPathStrategy])
}, [pageData, am, manifestName, manifestShortName, manifestStartUrl, manifestDisplay, manifestThemeColor, robotsDisallow, sheetsMode, fontPreconnect, fontPreload, imageLoading, imageDecoding, robotsMeta, assetPathStrategy])
return (
<div className="p-6 space-y-6">
@@ -487,6 +488,17 @@ export default function BuilderClientPage() {
placeholder="/private\n/tmp"
/>
</label>
<label className="block" htmlFor="ins-robots-meta">
<span className="sr-only">Robots Meta</span>
<input
id="ins-robots-meta"
aria-label="Robots Meta"
className="border rounded px-3 py-2 w-full"
value={robotsMeta}
onChange={(e) => setRobotsMeta(e.target.value)}
placeholder="noindex, nofollow"
/>
</label>
<label className="block" htmlFor="ins-sheets-mode">
<span className="sr-only">Google Sheets Template Mode</span>
<select