Enable GPU and set default scale to 1 in screencast

Author: yuanchuan

lib/handler.js

@@ -17,7 +17,7 @@ export async function handleRender(source, options) {
     options.type = type;
     options.delay = readTime(options.delay, { max: 30 * 1000 }) || 0;
     options.time = readTime(options.time, { max: 60 * 1000 }) || 0;
-    options.scale = Number(options.scale) || 2;
+    options.scale = Number(options.scale) || (options.time ? 1 : 2);
     options.selector ??= 'css-doodle';
 
     let title = options.time ? 'record' : 'image';

lib/render/index.js

@@ -59,7 +59,8 @@ export async function render(code, options = {}) {
         if (/^(css|cssd|stdin)$/.test(options.type)) {
             tag = await page.$eval('css-doodle', el => el.seed);
         }
-        options.output = `${options.title || 'screenshot'}-${tag}.png`;
+        let ext = options.time ? 'webm' : 'png';
+        options.output = `${options.title}-${tag}.${ext}`;
     }
 
     if (options.delay) {

lib/render/screencast.js

@@ -4,12 +4,11 @@ const defaultWidth = 1600;
 const defaultHeight = 900;
 
 export async function screencast(page, options) {
-    let { scale, output, selector } = options;
+    const { scale, output, selector } = options;
 
     await page.setViewport({
         width: defaultWidth,
         height: defaultHeight,
-        deviceScaleFactor: scale
     });
 
     const clip = await page.evaluate(selector => {
@@ -34,14 +33,12 @@ export async function screencast(page, options) {
     await page.setViewport({
         width: Math.ceil(clip.width) || defaultWidth,
         height: Math.ceil(clip.height) || defaultHeight,
-        deviceScaleFactor: scale
     });
 
-    output = options.output.replace(/\.png$/, '.webm');
     const recorder = await page.screencast({
         path: output,
-        scale: scale,
-        clip
+        scale,
+        clip,
     });
 
     await setTimeout(options.time);

lib/static.js

@@ -37,6 +37,8 @@ function getDefaultAppArgs() {
         '--enable-composited-animations',
         '--enable-optimized-css',
         '--enable-accelerated-2d-canvas',
+        '--enable-gpu',
+        '--use-angle',
     ];
 
     if (isLinux) {