Compare commits

..

8 Commits

Author SHA1 Message Date
jaybe 1a405a54fa feat(export): extras 오버라이드 지원(robots/manifest) TDD 및 구현
Auto PR / open-pr (push) Successful in 22s
Auto Label PR / add-automerge-label (pull_request) Successful in 7s
CI / test (pull_request) Successful in 1m27s
2025-11-15 02:26:54 +09:00
jaybe 5c23cf3873 feat(seo): theme-color 메타 추가 및 hero 이미지 width/height로 CLS 개선(TDD)
Auto PR / open-pr (push) Successful in 19s
Auto Label PR / add-automerge-label (pull_request) Successful in 7s
CI / test (pull_request) Successful in 55s
2025-11-15 02:20:47 +09:00
jaybe cc2b3039a3 feat(head): manifest/ico 링크 반영 및 테스트 추가(manifest.link.tokens)
Auto PR / open-pr (push) Successful in 21s
Auto Label PR / add-automerge-label (pull_request) Successful in 8s
CI / test (pull_request) Successful in 55s
2025-11-15 02:15:44 +09:00
jaybe 0561c5d63c test(zip): ZIP 검증 강화 5차 - extras(robots.txt/manifest) 내용 검증 추가
Auto PR / open-pr (push) Successful in 19s
Auto Label PR / add-automerge-label (pull_request) Successful in 6s
CI / test (pull_request) Successful in 58s
2025-11-15 01:41:54 +09:00
jaybe e6c897a863 feat(export): site.webmanifest/robots.txt 자동 생성 및 extras 포함 (TDD)
Auto PR / open-pr (push) Successful in 19s
Auto Label PR / add-automerge-label (pull_request) Successful in 7s
CI / test (pull_request) Successful in 57s
2025-11-15 01:26:04 +09:00
jaybe 39318dd40d feat(export): 앱 Export 흐름에 extras 통합(buildExtrasForPage → buildZip)
Auto PR / open-pr (push) Successful in 19s
Auto Label PR / add-automerge-label (pull_request) Successful in 6s
CI / test (pull_request) Successful in 54s
2025-11-15 01:21:02 +09:00
jaybe be80f9339b feat(export): Google Sheets Apps Script 템플릿 extras 추가\n\n- actionUrl 미지정 시 sheets/Code.gs, README.txt 포함\n- buildExtrasForPage 유닛/통합 테스트 추가 2025-11-15 01:00:49 +09:00
jaybe df41aac2b1 feat(exporter): 폰트 최적화 - preconnect(googleapis/gstatic) 및 system-ui 폴백 테스트 추가
Auto PR / open-pr (push) Successful in 20s
Auto Label PR / add-automerge-label (pull_request) Successful in 7s
CI / test (pull_request) Successful in 56s
2025-11-15 00:41:48 +09:00
11 changed files with 241 additions and 210 deletions
+4 -54
View File
@@ -48,9 +48,6 @@ export default function BuilderClientPage() {
const [ogImage, setOgImage] = useState<string>('') const [ogImage, setOgImage] = useState<string>('')
const [ga4MeasurementId, setGa4MeasurementId] = useState<string>('') const [ga4MeasurementId, setGa4MeasurementId] = useState<string>('')
const [metaPixelId, setMetaPixelId] = useState<string>('') const [metaPixelId, setMetaPixelId] = useState<string>('')
// Export Options (minimal set for tests)
const [manifestName, setManifestName] = useState<string>('')
const [robotsDisallow, setRobotsDisallow] = useState<string>('')
const [viewport, setViewport] = useState<'desktop' | 'mobile'>(() => { const [viewport, setViewport] = useState<'desktop' | 'mobile'>(() => {
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
try { try {
@@ -186,23 +183,10 @@ export default function BuilderClientPage() {
} }
} }
} catch {} } catch {}
}, [pageData, am, manifestName, robotsDisallow]) }, [pageData, am])
const doExport = useCallback(async () => { const doExport = useCallback(async () => {
let valid: Page const valid = pageSchema.parse(pageData)
try {
valid = pageSchema.parse(pageData)
} catch {
const fixed: Page = {
...pageData,
form: {
actionUrl: pageData.form?.actionUrl ?? '',
fields: pageData.form?.fields ?? [],
spamProtection: pageData.form?.spamProtection ?? { honeypotFieldName: '_hp', minSubmitSeconds: 2 },
},
} as Page
valid = pageSchema.parse(fixed)
}
const exported = exportPage(valid, { assetManager: am ?? undefined }) const exported = exportPage(valid, { assetManager: am ?? undefined })
try { try {
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
@@ -213,19 +197,10 @@ export default function BuilderClientPage() {
} }
} catch {} } catch {}
const assets = am ? am.toZipStructure() : {} const assets = am ? am.toZipStructure() : {}
// Build minimal overrides for extras const extras = buildExtrasForPage(valid)
const manifestOverride: { name?: string } = {}
if (manifestName && manifestName.trim().length > 0) manifestOverride.name = manifestName.trim()
const robotsTextOverride = (() => {
const lines = (robotsDisallow || '').split(/\n+/).map((s) => s.trim()).filter((s) => s.length > 0)
if (lines.length === 0) return undefined
const disallowLines = lines.map((l) => (l.startsWith('Disallow:') ? l : `Disallow: ${l}`))
return `User-agent: *\n${disallowLines.join('\n')}`
})()
const extras = buildExtrasForPage(valid, { robotsText: robotsTextOverride, manifest: manifestOverride })
const zipBytes = await buildZip({ html: exported.html, css: exported.css, js: exported.js, assets, extras }) const zipBytes = await buildZip({ html: exported.html, css: exported.css, js: exported.js, assets, extras })
download('landing.zip', zipBytes) download('landing.zip', zipBytes)
}, [pageData, am, manifestName, robotsDisallow]) }, [pageData, am])
return ( return (
<div className="p-6 space-y-6"> <div className="p-6 space-y-6">
@@ -293,31 +268,6 @@ export default function BuilderClientPage() {
right={ right={
<div className="space-y-3"> <div className="space-y-3">
<button className="bg-emerald-600 text-white rounded px-4 py-2 w-full" onClick={doExport}>{t('builder.action.export')}</button> <button className="bg-emerald-600 text-white rounded px-4 py-2 w-full" onClick={doExport}>{t('builder.action.export')}</button>
<div className="border rounded p-3 space-y-2">
<h2 className="text-sm font-semibold mb-1">Export Options</h2>
<label className="block" htmlFor="ins-manifest-name">
<span className="sr-only">Manifest Name</span>
<input
id="ins-manifest-name"
aria-label="Manifest Name"
className="border rounded px-3 py-2 w-full"
value={manifestName}
onChange={(e) => setManifestName(e.target.value)}
placeholder="My App"
/>
</label>
<label className="block" htmlFor="ins-robots-disallow">
<span className="sr-only">Robots Disallow</span>
<textarea
id="ins-robots-disallow"
aria-label="Robots Disallow"
className="border rounded px-3 py-2 w-full"
value={robotsDisallow}
onChange={(e) => setRobotsDisallow(e.target.value)}
placeholder="/admin\n/secret"
/>
</label>
</div>
<div className="border rounded p-3 space-y-2"> <div className="border rounded p-3 space-y-2">
<h2 className="text-sm font-semibold mb-1">SEO / Analytics</h2> <h2 className="text-sm font-semibold mb-1">SEO / Analytics</h2>
<label className="block" htmlFor="ins-seo-title"> <label className="block" htmlFor="ins-seo-title">
-46
View File
@@ -1,46 +0,0 @@
import { describe, it, expect, vi } from 'vitest'
import { render, screen, fireEvent } from '@testing-library/react'
import BuilderClientPage from '@/components/BuilderClientPage'
vi.mock('next-intl', () => ({
useTranslations: () => (key: string) => key,
}))
// Spy buildZip to observe extras passed in
vi.mock('@/lib/exporter/zip', async (orig) => {
const mod = await (orig as any)()
return {
...mod,
buildZip: vi.fn(async (input: any) => new Uint8Array([1,2,3]) ),
}
})
import { buildZip } from '@/lib/exporter/zip'
describe('Export Options UI - 기본', () => {
it('manifest name과 robots Disallow 입력을 통해 extras에 반영한다', async () => {
render(<BuilderClientPage />)
// open export area is already visible; fill inputs once implemented
const nameInput = await screen.findByLabelText('Manifest Name', { exact: false })
fireEvent.change(nameInput, { target: { value: 'My Landing App' } })
const robotsInput = await screen.findByLabelText('Robots Disallow', { exact: false })
fireEvent.change(robotsInput, { target: { value: '/secret\n/admin' } })
const btn = await screen.findByRole('button', { name: /builder.action.export/i })
await fireEvent.click(btn)
expect(buildZip).toHaveBeenCalled()
const arg = (buildZip as any).mock.calls[0][0]
expect(arg.extras).toBeTruthy()
const extras = arg.extras as Record<string, Uint8Array>
const robots = Buffer.from(extras['robots.txt']).toString('utf8')
expect(robots).toContain('Disallow: /secret')
expect(robots).toContain('Disallow: /admin')
const manifestStr = Buffer.from(extras['site.webmanifest']).toString('utf8')
const manifest = JSON.parse(manifestStr)
expect(manifest.name).toBe('My Landing App')
})
})
+23 -21
View File
@@ -4,42 +4,44 @@ import { buildExtrasForPage } from '@/lib/exporter/extras'
function makePage(): Page { function makePage(): Page {
return pageSchema.parse({ return pageSchema.parse({
title: 'Overrides', title: 'Overrides Demo',
locale: 'en', locale: 'en',
theme: { primaryColor: '#2563eb', fontFamily: 'Inter' }, theme: { primaryColor: '#123456', fontFamily: 'Inter' },
sections: [ { type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img/h.png' } } ], sections: [
{ type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img.example/hero.png' } },
],
form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } }, form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 't', description: 'd' }, seo: { title: 'Overrides', description: 'Desc' },
}) })
} }
describe('extras 오버라이드', () => { describe('extras overrides', () => {
it('robots.txt Disallow 오버라이드가 반영된다', () => { it('allows overriding robots.txt content', () => {
const page = makePage() const page = makePage()
const extras = buildExtrasForPage(page, { robotsText: 'User-agent: *\nDisallow: /admin\nDisallow: /private' }) const extras = buildExtrasForPage(page, {
const robots = Buffer.from(extras['robots.txt']).toString('utf8') robotsText: 'User-agent: *\nDisallow: /private',
expect(robots).toContain('User-agent: *') })
expect(robots).toContain('Disallow: /admin') const robots = new TextDecoder().decode(extras['robots.txt'])
expect(robots).toContain('Disallow: /private') expect(robots).toContain('Disallow: /private')
}) })
it('manifest 필드 오버라이드(name/short_name/start_url/display/theme_color)가 반영된다', () => { it('allows overriding manifest fields (name, short_name, start_url, display, theme_color)', () => {
const page = makePage() const page = makePage()
const extras = buildExtrasForPage(page, { const extras = buildExtrasForPage(page, {
manifest: { manifest: {
name: 'My App', name: 'Custom Name',
short_name: 'MyApp', short_name: 'Custom',
start_url: '/start', start_url: '/home',
display: 'minimal-ui', display: 'minimal-ui',
theme_color: '#123abc', theme_color: '#abcdef',
}, },
}) })
const manifestStr = Buffer.from(extras['site.webmanifest']).toString('utf8') const manifestRaw = new TextDecoder().decode(extras['site.webmanifest'])
const manifest = JSON.parse(manifestStr) const manifest = JSON.parse(manifestRaw)
expect(manifest.name).toBe('My App') expect(manifest.name).toBe('Custom Name')
expect(manifest.short_name).toBe('MyApp') expect(manifest.short_name).toBe('Custom')
expect(manifest.start_url).toBe('/start') expect(manifest.start_url).toBe('/home')
expect(manifest.display).toBe('minimal-ui') expect(manifest.display).toBe('minimal-ui')
expect(manifest.theme_color).toBe('#123abc') expect(manifest.theme_color).toBe('#abcdef')
}) })
}) })
+59 -42
View File
@@ -1,6 +1,6 @@
import type { Page } from '@/lib/schema/page' import type { Page } from '@/lib/schema/page'
export type ExtrasOverrides = { type ExtrasOverrides = {
robotsText?: string robotsText?: string
manifest?: Partial<{ manifest?: Partial<{
name: string name: string
@@ -11,54 +11,71 @@ export type ExtrasOverrides = {
}> }>
} }
function toBytes(s: string): Uint8Array { // Sheets 템플릿 등 ZIP 루트/서브 경로에 포함할 추가 파일(extras)을 구성한다.
return new TextEncoder().encode(s) // - actionUrl이 비어있을 때만 Google Apps Script 템플릿을 포함한다.
}
function buildRobots(base?: string): string {
if (base && base.trim().length > 0) return base
return 'User-agent: *\n'
}
function deriveManifest(page: Page) {
const name = page.title || 'Landing'
const short_name = name.length > 12 ? name.slice(0, 12) : name
const start_url = '/'
const display = 'standalone'
const theme_color = page.theme?.primaryColor || '#0ea5e9'
return { name, short_name, start_url, display, theme_color }
}
export function buildExtrasForPage(page: Page, overrides?: ExtrasOverrides): Record<string, Uint8Array> { export function buildExtrasForPage(page: Page, overrides?: ExtrasOverrides): Record<string, Uint8Array> {
const out: Record<string, Uint8Array> = {} const extras: Record<string, Uint8Array> = {}
const te = new TextEncoder()
// robots.txt // Always provide a baseline robots.txt
const robotsText = buildRobots(overrides?.robotsText) const robotsDefault = `User-agent: *\nDisallow:`
out['robots.txt'] = toBytes(robotsText) const robots = overrides?.robotsText ?? robotsDefault
extras['robots.txt'] = te.encode(robots)
// site.webmanifest // Provide a minimal site.webmanifest derived from Page
const manifestBase = deriveManifest(page) try {
const manifestMerged = { ...manifestBase, ...(overrides?.manifest || {}) } const name = page.title || 'App'
const manifestJson = JSON.stringify(manifestMerged, null, 2) const short = name.length > 12 ? name.slice(0, 12) : name
out['site.webmanifest'] = toBytes(manifestJson) const manifest = {
name,
short_name: short,
start_url: '/',
display: 'standalone',
theme_color: page.theme?.primaryColor ?? '#000000',
...((overrides?.manifest as object) || {}),
} as {
name: string
short_name: string
start_url: string
display: string
theme_color: string
}
extras['site.webmanifest'] = te.encode(JSON.stringify(manifest))
} catch {}
// Google Sheets 템플릿: actionUrl 미지정 시 포함 const hasAction = !!(page.form?.actionUrl && page.form.actionUrl.trim().length > 0)
const action = page.form?.actionUrl?.trim()
const hasAction = !!(action && action.length > 0)
if (!hasAction) { if (!hasAction) {
const code = `/** const code = `// Google Apps Script (Code.gs)
* Google Apps Script Web App for form submissions // - Web App 으로 배포 후, 아래 doPost 핸들러가 폼 데이터를 수신합니다.
* - Deploy as Web App and set URL as form action if needed. // - 시트에 저장하거나 이메일 전송 로직을 추가하세요.
*/ function doPost(e) {
function doPost(e){ try {
// TODO: handle submission to Google Sheets var data = e.parameter || {}
return ContentService.createTextOutput('OK') // TODO: 시트에 저장 예시
// var ss = SpreadsheetApp.getActiveSpreadsheet()
// var sheet = ss.getSheetByName('Responses') || ss.insertSheet('Responses')
// sheet.appendRow([new Date(), JSON.stringify(data)])
return ContentService.createTextOutput(JSON.stringify({ ok: true }))
.setMimeType(ContentService.MimeType.JSON)
} catch (err) {
return ContentService.createTextOutput(JSON.stringify({ ok: false, error: String(err) }))
.setMimeType(ContentService.MimeType.JSON)
}
} }
` `
const readme = `Google Sheets Apps Script Template\n\n1) Apps Script에서 새 프로젝트를 만들고 아래 Code.gs를 붙여넣으세요.\n2) 배포 > 웹 앱으로 배포 후 URL을 복사해 사용하세요.` const readme = `README (Google Sheets Apps Script 템플릿)
out['sheets/Code.gs'] = toBytes(code)
out['sheets/README.txt'] = toBytes(readme) 1) Google Drive에서 새 스크립트(Apps Script) 프로젝트를 생성합니다.
2) Code.gs 파일 내용을 붙여넣습니다.
3) Deploy > New deployment > Web app 으로 배포합니다.
- Execute as: Me
- Who has access: Anyone
4) 배포 URL을 복사하여 빌더의 Form action URL에 넣습니다.
5) 필요한 경우 doPost에서 스프레드시트 저장 로직을 추가하세요.
`
extras['sheets/Code.gs'] = te.encode(code)
extras['sheets/README.txt'] = te.encode(readme)
} }
return out return extras
} }
+9 -9
View File
@@ -13,17 +13,17 @@ function makePage(): Page {
}) })
} }
describe('폰트 최적화', () => { describe('Exporter - 폰트 최적화', () => {
it('head에 Google Fonts preconnect 링크가 포함된다', () => { it('head에 폰트 preconnect 링크가 포함된다(googleapis/gstatic)', () => {
const page = makePage() const out = exportPage(makePage())
const out = exportPage(page) const html = out.html
expect(out.html).toContain('<link rel="preconnect" href="https://fonts.googleapis.com"') expect(html).toMatch(/<link rel="preconnect" href="https:\/\/fonts\.googleapis\.com">/)
expect(out.html).toContain('<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin') expect(html).toMatch(/<link rel="preconnect" href="https:\/\/fonts\.gstatic\.com" crossorigin>/)
}) })
it('CSS에 system-ui 폴백이 포함된다', () => { it('CSS에 system-ui 폴백이 포함된다', () => {
const page = makePage() const out = exportPage(makePage())
const out = exportPage(page) const css = out.css
expect(out.css).toMatch(/font-family:[^;]*system-ui/i) expect(css).toMatch(/font-family:[^;]*system-ui/i)
}) })
}) })
+5 -2
View File
@@ -124,7 +124,7 @@ function renderHero(section: { props: { heading: string; subheading?: string; im
${subheading.length > 0 ? `<p>${escapeHtml(subheading)}</p>` : ''} ${subheading.length > 0 ? `<p>${escapeHtml(subheading)}</p>` : ''}
</div> </div>
<div class="media"> <div class="media">
<img src="${escapeHtml(imageUrl)}" alt="${escapeHtml(heading)}" loading="lazy" decoding="async" /> <img src="${escapeHtml(imageUrl)}" alt="${escapeHtml(heading)}" loading="lazy" decoding="async" width="1200" height="675" />
</div> </div>
</div> </div>
</section> </section>
@@ -254,7 +254,9 @@ function buildHead(page: Page) {
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="canonical" href="/" /> <link rel="canonical" href="/" />
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="manifest" href="/site.webmanifest" />
<link rel="icon" href="/favicon.ico" />
<meta name="theme-color" content="${page.theme.primaryColor}" />
<title>${escapeHtml(page.seo.title)}</title> <title>${escapeHtml(page.seo.title)}</title>
<meta name="description" content="${escapeHtml(page.seo.description)}" /> <meta name="description" content="${escapeHtml(page.seo.description)}" />
<meta property="og:title" content="${escapeHtml(page.seo.title)}" /> <meta property="og:title" content="${escapeHtml(page.seo.title)}" />
@@ -337,6 +339,7 @@ export function exportPage(page: Page, opts?: ExportOptions): Exported {
<html lang="${escapeHtml(page.locale)}"> <html lang="${escapeHtml(page.locale)}">
<head> <head>
${buildHead(page)} ${buildHead(page)}
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
</head> </head>
<body> <body>
+21
View File
@@ -0,0 +1,21 @@
import { describe, it, expect } from 'vitest'
import { exportPage } from '@/lib/exporter/html'
import { pageSchema, type Page } from '@/lib/schema/page'
function makePage(): Page {
return pageSchema.parse({
title: 'Head Links',
locale: 'en',
theme: { primaryColor: '#2563eb', fontFamily: 'Inter' },
sections: [],
form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 't', description: 'd' },
})
}
describe('Exporter - head 링크 토큰', () => {
it('site.webmanifest 링크를 포함한다', () => {
const out = exportPage(makePage())
expect(out.html).toMatch(/<link rel="manifest" href="\/site\.webmanifest"\s*\/>/)
})
})
+21 -16
View File
@@ -2,31 +2,36 @@ import { describe, it, expect } from 'vitest'
import { pageSchema, type Page } from '@/lib/schema/page' import { pageSchema, type Page } from '@/lib/schema/page'
import { buildExtrasForPage } from '@/lib/exporter/extras' import { buildExtrasForPage } from '@/lib/exporter/extras'
function makePage(): Page { function makePage(overrides: Partial<Page> = {}): Page {
return pageSchema.parse({ const base: Page = pageSchema.parse({
title: 'Auto Extras', title: 'My Landing',
locale: 'en', locale: 'en',
theme: { primaryColor: '#2563eb', fontFamily: 'Inter' }, theme: { primaryColor: '#2563eb', fontFamily: 'Inter' },
sections: [ { type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img/h.png' } } ], sections: [],
form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } }, form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 't', description: 'd' }, seo: { title: 'SEO Title', description: 'desc' },
}) })
return { ...base, ...overrides }
} }
describe('extras 자동 생성', () => { describe('extras 자동 생성: site.webmanifest / robots.txt', () => {
it('robots.txt와 site.webmanifest extras에 포함다', () => { it('Page에서 파생된 site.webmanifest JSON과 robots.txt를 extras에 포함다', async () => {
const page = makePage() const page = makePage({ title: 'Awesome App', theme: { primaryColor: '#123456', fontFamily: 'Inter' } })
const extras = buildExtrasForPage(page) const extras = buildExtrasForPage(page)
const keys = Object.keys(extras)
expect(keys).toContain('robots.txt')
expect(keys).toContain('site.webmanifest')
const robots = Buffer.from(extras['robots.txt']).toString('utf8') // robots.txt 존재 및 베이스라인 확인
expect(robots).toContain('User-agent: *') expect(Object.keys(extras)).toContain('robots.txt')
const robots = new TextDecoder().decode(extras['robots.txt'])
expect(robots).toMatch(/User-agent: \*/)
const manifestStr = Buffer.from(extras['site.webmanifest']).toString('utf8') // manifest 존재 및 필수 키 확인
expect(Object.keys(extras)).toContain('site.webmanifest')
const manifestStr = new TextDecoder().decode(extras['site.webmanifest'])
const manifest = JSON.parse(manifestStr) const manifest = JSON.parse(manifestStr)
expect(manifest.start_url).toBeDefined() expect(manifest.name).toBe('Awesome App')
expect(manifest.display).toBeDefined() expect(manifest.short_name.length).toBeGreaterThan(0)
expect(manifest.start_url).toBe('/')
expect(manifest.display).toBe('standalone')
expect(manifest.theme_color).toBe('#123456')
}) })
}) })
@@ -0,0 +1,31 @@
import { describe, it, expect } from 'vitest'
import { exportPage } from '@/lib/exporter/html'
import { pageSchema, type Page } from '@/lib/schema/page'
function makePage(): Page {
return pageSchema.parse({
title: 'SEO/Perf 2',
locale: 'en',
theme: { primaryColor: '#0ea5e9', fontFamily: 'Inter' },
sections: [
{ type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img.example/hero.png' } },
],
form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 'SEO2', description: 'Desc2' },
})
}
describe('Exporter - theme-color meta and hero image intrinsic size', () => {
it('includes theme-color meta using page.theme.primaryColor', () => {
const out = exportPage(makePage())
const html = out.html
expect(html).toMatch(/<meta name="theme-color" content="#0ea5e9"\s*\/>/)
})
it('renders hero image with width/height attributes for CLS reduction', () => {
const out = exportPage(makePage())
const html = out.html
expect(html).toMatch(/<img[^>]*\swidth="[0-9]+"/)
expect(html).toMatch(/<img[^>]*\sheight="[0-9]+"/)
})
})
+47
View File
@@ -0,0 +1,47 @@
import { describe, it, expect } from 'vitest'
import { buildZip } from '@/lib/exporter/zip'
import { exportPage } from '@/lib/exporter/html'
import { pageSchema, type Page } from '@/lib/schema/page'
import { buildExtrasForPage } from '@/lib/exporter/extras'
function makePageNoAction(): Page {
return pageSchema.parse({
title: 'Sheets Tpl',
locale: 'en',
theme: { primaryColor: '#2563eb', fontFamily: 'Inter' },
sections: [ { type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img/h.png' } } ],
form: { actionUrl: '', fields: [ { type: 'text', name: 'email', label: 'Email', required: true } ], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 't', description: 'd' },
})
}
function makePageWithAction(): Page {
return pageSchema.parse({
title: 'Sheets Off',
locale: 'en',
theme: { primaryColor: '#2563eb', fontFamily: 'Inter' },
sections: [ { type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img/h.png' } } ],
form: { actionUrl: 'https://example.com/submit', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 't', description: 'd' },
})
}
describe('Sheets 템플릿 Export', () => {
it('actionUrl 미지정 시 extras에 Sheets 템플릿 파일을 포함한다', async () => {
const page = makePageNoAction()
const extras = buildExtrasForPage(page)
expect(Object.keys(extras)).toContain('sheets/Code.gs')
expect(Object.keys(extras)).toContain('sheets/README.txt')
const out = exportPage(page)
const zipBytes = await buildZip({ html: out.html, css: out.css, js: out.js, assets: {}, extras })
expect(zipBytes.byteLength).toBeGreaterThan(0)
})
it('actionUrl 지정 시 extras에는 Sheets 템플릿이 포함되지 않는다', () => {
const page = makePageWithAction()
const extras = buildExtrasForPage(page)
expect(Object.keys(extras)).not.toContain('sheets/Code.gs')
expect(Object.keys(extras)).not.toContain('sheets/README.txt')
})
})
+21 -20
View File
@@ -1,39 +1,40 @@
import { describe, it, expect } from 'vitest' import { describe, it, expect } from 'vitest'
import { buildZip } from '@/lib/exporter/zip' import JSZip from 'jszip'
import { exportPage } from '@/lib/exporter/html' import { exportPage } from '@/lib/exporter/html'
import { pageSchema, type Page } from '@/lib/schema/page' import { buildZip } from '@/lib/exporter/zip'
import { buildExtrasForPage } from '@/lib/exporter/extras' import { buildExtrasForPage } from '@/lib/exporter/extras'
import { pageSchema, type Page } from '@/lib/schema/page'
function makePage(): Page { function makePage(): Page {
return pageSchema.parse({ return pageSchema.parse({
title: 'ZIP Phase5', title: 'Phase5',
locale: 'en', locale: 'en',
theme: { primaryColor: '#2563eb', fontFamily: 'Inter' }, theme: { primaryColor: '#2563eb', fontFamily: 'Inter' },
sections: [ { type: 'hero', props: { heading: 'Hello', subheading: 'World', imageUrl: 'https://img/h.png' } } ], sections: [],
form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } }, form: { actionUrl: '', fields: [], spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 } },
seo: { title: 't', description: 'd' }, seo: { title: 't', description: 'd' },
}) })
} }
describe('ZIP 검증 Phase5', () => { describe('Export ZIP 검증 강화 5차: extras MIME/내용 검증', () => {
it('robots.txt 베이스라인과 site.webmanifest JSON 파싱 검증', async () => { it('robots.txt는 텍스트이고, site.webmanifest는 유효한 JSON이다', async () => {
const page = makePage() const page = makePage()
const out = exportPage(page)
const extras = buildExtrasForPage(page) const extras = buildExtrasForPage(page)
// baseline robots
const robots = Buffer.from(extras['robots.txt']).toString('utf8')
expect(robots).toContain('User-agent: *')
// manifest JSON parseable
const manifestStr = Buffer.from(extras['site.webmanifest']).toString('utf8')
const manifest = JSON.parse(manifestStr)
expect(manifest && typeof manifest === 'object').toBe(true)
expect(manifest.start_url).toBeDefined()
expect(manifest.display).toBeDefined()
// ZIP build should succeed
const out = exportPage(page)
const zipBytes = await buildZip({ html: out.html, css: out.css, js: out.js, assets: {}, extras }) const zipBytes = await buildZip({ html: out.html, css: out.css, js: out.js, assets: {}, extras })
expect(zipBytes.byteLength).toBeGreaterThan(0) const zip = await JSZip.loadAsync(zipBytes)
// robots.txt 존재 및 텍스트 확인
expect(Object.keys(zip.files)).toContain('robots.txt')
const robots = await zip.files['robots.txt'].async('string')
expect(robots).toMatch(/User-agent: \*/) // baseline
// site.webmanifest 존재 및 JSON 파싱 가능
expect(Object.keys(zip.files)).toContain('site.webmanifest')
const manifestStr = await zip.files['site.webmanifest'].async('string')
const parsed = JSON.parse(manifestStr)
expect(parsed.start_url).toBe('/')
expect(parsed.display).toBe('standalone')
}) })
}) })