✨ Default static-site and storybook screenshots to full-page

clients/static-site/README.md

@@ -73,7 +73,7 @@ export default {
     },
 
     screenshot: {
-      fullPage: false,
+      fullPage: true,
       omitBackground: false,
     },
 
@@ -140,7 +140,8 @@ Configuration is merged in this order (later overrides earlier):
 - `--exclude <pattern>` - Exclude page pattern (glob)
 - `--browser-args <args>` - Additional Puppeteer browser arguments
 - `--headless` - Run browser in headless mode (default: true)
-- `--full-page` - Capture full page screenshots (default: false)
+- `--full-page` - Capture full page screenshots (default: true)
+- `--no-full-page` - Capture viewport-only screenshots
 - `--timeout <ms>` - Screenshot timeout in milliseconds (default: 45000)
 - `--dry-run` - Print discovered pages and task count without capturing screenshots
 - `--use-sitemap` - Use sitemap.xml for page discovery (default: true)

clients/static-site/examples/vizzly.config.js

@@ -44,7 +44,7 @@ export default {
 
     // Screenshot options
     screenshot: {
-      fullPage: false, // Capture visible viewport only
+      fullPage: true, // Capture full scrollable page
       omitBackground: false, // Include page background
     },
 

clients/static-site/src/config-schema.js

@@ -43,7 +43,7 @@ let browserSchema = z.object({
  * Screenshot configuration schema
  */
 let screenshotSchema = z.object({
-  fullPage: z.boolean().default(false),
+  fullPage: z.boolean().default(true),
   omitBackground: z.boolean().default(false),
   timeout: z.number().int().positive().default(45_000), // 45 seconds
 });
@@ -96,13 +96,19 @@ export let staticSiteConfigSchema = z
       args: [],
     }),
     screenshot: screenshotSchema.default({
-      fullPage: false,
+      fullPage: true,
       omitBackground: false,
       timeout: 45_000,
     }),
     concurrency: z.number().int().positive().default(getDefaultConcurrency()),
-    include: z.union([z.string(), z.array(z.string())]).nullable().optional(),
-    exclude: z.union([z.string(), z.array(z.string())]).nullable().optional(),
+    include: z
+      .union([z.string(), z.array(z.string())])
+      .nullable()
+      .optional(),
+    exclude: z
+      .union([z.string(), z.array(z.string())])
+      .nullable()
+      .optional(),
     pageDiscovery: pageDiscoverySchema.default({
       useSitemap: true,
       sitemapPath: 'sitemap.xml',
@@ -114,7 +120,7 @@ export let staticSiteConfigSchema = z
   .default({
     viewports: [{ name: 'default', width: 1920, height: 1080 }],
     browser: { type: 'chromium', headless: true, args: [] },
-    screenshot: { fullPage: false, omitBackground: false, timeout: 45_000 },
+    screenshot: { fullPage: true, omitBackground: false, timeout: 45_000 },
     concurrency: getDefaultConcurrency(),
     pageDiscovery: {
       useSitemap: true,

clients/static-site/src/config.js

@@ -20,7 +20,7 @@ export let defaultConfig = {
     args: [],
   },
   screenshot: {
-    fullPage: false,
+    fullPage: true,
     omitBackground: false,
   },
   concurrency: 3,

clients/static-site/src/plugin.js

@@ -25,7 +25,7 @@ export default {
         args: [],
       },
       screenshot: {
-        fullPage: false,
+        fullPage: true,
         omitBackground: false,
       },
       concurrency: getDefaultConcurrency(),
@@ -71,6 +71,7 @@ export default {
       .option('--browser-args <args>', 'Additional browser arguments')
       .option('--headless', 'Run browser in headless mode')
       .option('--full-page', 'Capture full page screenshots')
+      .option('--no-full-page', 'Capture viewport-only screenshots')
       .option(
         '--timeout <ms>',
         'Screenshot timeout in milliseconds (default: 45000)',

clients/static-site/src/screenshot.js

@@ -65,14 +65,14 @@ let DEFAULT_SCREENSHOT_TIMEOUT = 45_000;
  * Capture a screenshot from a page
  * @param {Object} page - Playwright page instance
  * @param {Object} options - Screenshot options
- * @param {boolean} [options.fullPage=false] - Capture full page
+ * @param {boolean} [options.fullPage=true] - Capture full page
  * @param {boolean} [options.omitBackground=false] - Omit background (transparent)
  * @param {number} [options.timeout=45000] - Screenshot timeout in ms
  * @returns {Promise<Buffer>} Screenshot buffer
  */
 export async function captureScreenshot(page, options = {}) {
   let {
-    fullPage = false,
+    fullPage = true,
     omitBackground = false,
     timeout = DEFAULT_SCREENSHOT_TIMEOUT,
   } = options;

clients/static-site/tests/cli-options.test.js

@@ -29,26 +29,26 @@ describe('CLI Options', () => {
     assert.deepStrictEqual(result.screenshot, { fullPage: false });
   });
 
-  it('preserves config fullPage: true when CLI option not set', () => {
+  it('preserves config fullPage: false when CLI option not set', () => {
     let defaultConfig = {
-      screenshot: { fullPage: false, omitBackground: false },
+      screenshot: { fullPage: true, omitBackground: false },
     };
 
     let userConfig = {
-      screenshot: { fullPage: true, omitBackground: false },
+      screenshot: { fullPage: false, omitBackground: false },
     };
 
     let cliOptions = {}; // No CLI options
     let parsedCli = parseCliOptions(cliOptions);
 
     let result = mergeConfigs(defaultConfig, userConfig, parsedCli);
 
-    assert.strictEqual(result.screenshot.fullPage, true);
+    assert.strictEqual(result.screenshot.fullPage, false);
   });
 
   it('allows CLI option to override config fullPage', () => {
     let defaultConfig = {
-      screenshot: { fullPage: false, omitBackground: false },
+      screenshot: { fullPage: true, omitBackground: false },
     };
 
     let userConfig = {

clients/static-site/tests/config-schema.test.js

@@ -53,6 +53,12 @@ describe('config-schema', () => {
       assert.ok(validated.pageDiscovery);
     });
 
+    it('defaults screenshot.fullPage to true', () => {
+      let validated = validateStaticSiteConfig({});
+
+      assert.strictEqual(validated.screenshot.fullPage, true);
+    });
+
     it('applies default concurrency from CPU cores', () => {
       let config = {};
 

clients/storybook/README.md

@@ -68,7 +68,7 @@ export default {
     },
 
     screenshot: {
-      fullPage: false,
+      fullPage: true,
       omitBackground: false,
     },
 
@@ -139,7 +139,8 @@ Configuration is merged in this order (later overrides earlier):
 - `--config <path>` - Path to custom config file
 - `--browser-args <args>` - Additional Puppeteer browser arguments
 - `--headless` - Run browser in headless mode (default: true)
-- `--full-page` - Capture full page screenshots (default: false)
+- `--full-page` - Capture full page screenshots (default: true)
+- `--no-full-page` - Capture viewport-only screenshots
 
 ## Interaction Hooks
 

clients/storybook/src/config.js

@@ -32,7 +32,7 @@ export let defaultConfig = {
     args: [],
   },
   screenshot: {
-    fullPage: false,
+    fullPage: true,
     omitBackground: false,
   },
   concurrency: getDefaultConcurrency(),

clients/storybook/src/plugin.js

@@ -23,7 +23,7 @@ export default {
         args: [],
       },
       screenshot: {
-        fullPage: false,
+        fullPage: true,
         omitBackground: false,
       },
       concurrency: 3,
@@ -67,7 +67,8 @@ export default {
         'Run browser in headless mode (default: true)',
         true
       )
-      .option('--full-page', 'Capture full page screenshots', false)
+      .option('--full-page', 'Capture full page screenshots')
+      .option('--no-full-page', 'Capture viewport-only screenshots')
       .action(async (path, options) => {
         try {
           let { run } = await import('./index.js');

clients/storybook/src/screenshot.js

@@ -43,12 +43,12 @@ const SCREENSHOT_TIMEOUT_MS = 45_000;
  * Capture a screenshot from a page
  * @param {Object} page - Playwright page instance
  * @param {Object} options - Screenshot options
- * @param {boolean} [options.fullPage=false] - Capture full page
+ * @param {boolean} [options.fullPage=true] - Capture full page
  * @param {boolean} [options.omitBackground=false] - Omit background (transparent)
  * @returns {Promise<Buffer>} Screenshot buffer
  */
 export async function captureScreenshot(page, options = {}) {
-  let { fullPage = false, omitBackground = false } = options;
+  let { fullPage = true, omitBackground = false } = options;
 
   // Playwright has built-in timeout support
   let screenshot = await page.screenshot({

clients/storybook/tests/config.test.js

@@ -71,6 +71,13 @@ describe('parseCliOptions', () => {
 
     assert.equal(config.screenshot.fullPage, true);
   });
+
+  it('should parse fullPage false for --no-full-page', () => {
+    let options = { fullPage: false };
+    let config = parseCliOptions(options);
+
+    assert.equal(config.screenshot.fullPage, false);
+  });
 });
 
 describe('mergeConfigs', () => {
@@ -124,7 +131,7 @@ describe('mergeStoryConfig', () => {
   it('should merge story config with global config', () => {
     let globalConfig = {
       viewports: [{ name: 'desktop', width: 1920, height: 1080 }],
-      screenshot: { fullPage: false },
+      screenshot: { fullPage: true },
     };
 
     let storyConfig = {
@@ -134,7 +141,7 @@ describe('mergeStoryConfig', () => {
     let merged = mergeStoryConfig(globalConfig, storyConfig);
 
     assert.equal(merged.viewports[0].name, 'mobile');
-    assert.equal(merged.screenshot.fullPage, false);
+    assert.equal(merged.screenshot.fullPage, true);
   });
 
   it('should return global config if no story config', () => {

clients/storybook/tests/screenshot.test.js

@@ -50,21 +50,21 @@ describe('captureScreenshot', () => {
     assert.equal(result, mockBuffer);
     assert.equal(mockScreenshot.mock.calls.length, 1);
     assert.deepEqual(mockScreenshot.mock.calls[0].arguments[0], {
-      fullPage: false,
+      fullPage: true,
       omitBackground: false,
       timeout: 45000,
     });
   });
 
-  it('should capture full page screenshot', async () => {
+  it('should capture viewport screenshot when fullPage is false', async () => {
     let mockBuffer = Buffer.from('fake-screenshot');
     let mockScreenshot = mock.fn(() => mockBuffer);
     let mockPage = { screenshot: mockScreenshot };
 
-    await captureScreenshot(mockPage, { fullPage: true });
+    await captureScreenshot(mockPage, { fullPage: false });
 
     assert.deepEqual(mockScreenshot.mock.calls[0].arguments[0], {
-      fullPage: true,
+      fullPage: false,
       omitBackground: false,
       timeout: 45000,
     });
@@ -78,7 +78,7 @@ describe('captureScreenshot', () => {
     await captureScreenshot(mockPage, { omitBackground: true });
 
     assert.deepEqual(mockScreenshot.mock.calls[0].arguments[0], {
-      fullPage: false,
+      fullPage: true,
       omitBackground: true,
       timeout: 45000,
     });
@@ -107,11 +107,11 @@ describe('captureAndSendScreenshot', () => {
     let viewport = { name: 'mobile' };
 
     await captureAndSendScreenshot(mockPage, story, viewport, {
-      fullPage: true,
+      fullPage: false,
     });
 
     assert.deepEqual(mockScreenshot.mock.calls[0].arguments[0], {
-      fullPage: true,
+      fullPage: false,
       omitBackground: false,
       timeout: 45000,
     });