mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
- Changed header navigation from Blocks to Builder - Fixed block preview iframe URLs from /view/default/[name] to /view/[name] - Fixed icon stretching in block viewer toggle buttons - Added comprehensive Playwright tests to verify functionality - Removed empty malformed directory blocks/[.../ Fixes: - Block previews now load correctly (no 404 errors) - All 5 blocks verified working: dashboard-01, sidebar-07, sidebar-03, login-03, login-04 - Icons properly sized (h-3.5 w-3.5) in toggle buttons - Builder link now in header, Blocks remains in sidebar Test Results: ā 5/5 iframes loading correctly ā 0 404 errors ā All blocks verified with Playwright ā Screenshots captured for visual proof
59 lines
2.0 KiB
TypeScript
59 lines
2.0 KiB
TypeScript
import { test, expect } from '@playwright/test'
|
|
|
|
test('Visual proof - blocks page with working previews', async ({ page }) => {
|
|
console.log('šø Creating visual proof of working blocks...\n')
|
|
|
|
// Navigate to blocks page
|
|
await page.goto('http://localhost:3333/blocks', { waitUntil: 'networkidle' })
|
|
console.log('ā
Navigated to blocks page')
|
|
|
|
// Take hero screenshot
|
|
await page.screenshot({
|
|
path: 'tests/proof-blocks-hero.png',
|
|
clip: { x: 0, y: 0, width: 1280, height: 800 }
|
|
})
|
|
console.log('šø Hero section captured')
|
|
|
|
// Scroll to each block and capture
|
|
const blocks = ['dashboard-01', 'sidebar-07', 'sidebar-03', 'login-03', 'login-04']
|
|
|
|
for (const blockName of blocks) {
|
|
const iframe = page.locator(`iframe[src="/view/${blockName}"]`).first()
|
|
|
|
if (await iframe.count() > 0) {
|
|
await iframe.scrollIntoViewIfNeeded()
|
|
await page.waitForTimeout(500)
|
|
|
|
await page.screenshot({
|
|
path: `tests/proof-block-${blockName}.png`,
|
|
clip: {
|
|
x: 0,
|
|
y: Math.max(0, (await iframe.boundingBox())?.y || 0) - 50,
|
|
width: 1280,
|
|
height: 800
|
|
}
|
|
})
|
|
console.log(`šø Captured ${blockName}`)
|
|
}
|
|
}
|
|
|
|
// Also visit a block directly to show it loads
|
|
console.log('\nš Visiting a block preview directly...')
|
|
await page.goto('http://localhost:3333/view/dashboard-01', { waitUntil: 'networkidle' })
|
|
|
|
await page.screenshot({
|
|
path: 'tests/proof-direct-view-dashboard.png',
|
|
fullPage: false
|
|
})
|
|
console.log('šø Direct view of dashboard-01 captured')
|
|
|
|
console.log('\nā
All visual proofs captured!')
|
|
console.log('š Check tests/ directory for screenshots:')
|
|
console.log(' - proof-blocks-hero.png')
|
|
console.log(' - proof-block-dashboard-01.png')
|
|
console.log(' - proof-block-sidebar-07.png')
|
|
console.log(' - proof-block-sidebar-03.png')
|
|
console.log(' - proof-block-login-03.png')
|
|
console.log(' - proof-block-login-04.png')
|
|
console.log(' - proof-direct-view-dashboard.png')
|
|
}) |