@lcap/builder/lib/commands/screenshots.js

lcap builder utils

"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
/* eslint-disable no-continue */
/* eslint-disable no-await-in-loop */
/* eslint-disable no-plusplus */
const fs_extra_1 = __importDefault(require("fs-extra"));
const fast_glob_1 = __importDefault(require("fast-glob"));
const path_1 = __importDefault(require("path"));
const block_1 = require("../utils/block");
const logger_1 = __importDefault(require("../utils/logger"));
// eslint-disable-next-line no-promise-executor-return
const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
exports.default = (rootPath, port = 6006, folder) => __awaiter(void 0, void 0, void 0, function* () {
    // eslint-disable-next-line global-require
    const puppeteer = require('puppeteer');
    const browser = yield puppeteer.launch();
    const page = yield browser.newPage();
    yield page.setViewport({
        width: 1180,
        height: 600,
        deviceScaleFactor: 2,
    });
    const searchPath = folder
        ? `src/components/${folder}/stories/block.stories.{tsx,ts,jsx,js,vue}`
        : '**/stories/block.stories.{js,ts,jsx,tsx}';
    const storyPaths = yield (0, fast_glob_1.default)(searchPath, { cwd: rootPath, absolute: true });
    for (let i = 0; i < storyPaths.length; i++) {
        const content = fs_extra_1.default.readFileSync(storyPaths[i], 'utf-8');
        const blockInfos = (0, block_1.getBlockInfos)(content.toString());
        if (!blockInfos || blockInfos.length === 0) {
            logger_1.default.warn('未找到block');
            continue;
        }
        const screenshotDir = path_1.default.resolve(storyPaths[i], '../../screenshots');
        if (!fs_extra_1.default.existsSync(screenshotDir)) {
            fs_extra_1.default.mkdirSync(screenshotDir);
        }
        for (let j = 0; j < blockInfos.length; j++) {
            const url = `http://127.0.0.1:${port}/iframe.html?viewMode=story&id=${blockInfos[j].id}`;
            logger_1.default.info(`screenshot url: ${url}, block: ${blockInfos[j].name}`);
            yield page.goto(url);
            yield sleep(500);
            const el = yield page.$('#storybook-root');
            if (!el || (yield el.isHidden())) {
                logger_1.default.warn('element is null');
                continue;
            }
            yield el.screenshot({ path: `${screenshotDir}/${j}.png` });
        }
    }
    yield browser.close();
});