async function thumbnail()

in scripts/thumbnail.js [37:101]


async function thumbnail(seriesName) {
  const seriesPath = path.join(__dirname, '..', 'custom-series', seriesName);
  const testPath = path.join(seriesPath, 'test', 'index.html');
  const outputPath = path.join('./screenshots', `${seriesName}.svg`);

  // Install the custom series
  const customSeries = require(`../custom-series/${seriesName}`);
  echarts.use(customSeries);

  let chart = echarts.init(null, null, {
    renderer: 'svg',
    ssr: true,
    width: 600,
    height: 400,
  });

  // Load the js code from the content of the last <script></script>
  // in 'test/index.html'
  const html = fs.readFileSync(testPath, 'utf8');
  const lastScriptStartIndex = html.lastIndexOf('<script>');
  const lastScriptEndIndex = html.lastIndexOf('</script>');
  const jsCode = html.substring(lastScriptStartIndex + 8, lastScriptEndIndex);

  // Ignore the lines containing `echarts.use`, `echarts.init` and `.setOption`
  // TODO: Not considered the case where there are multiple `chart.setOption`
  // calls
  const lines = jsCode.split('\n');
  const code = lines
    .filter(
      (line) =>
        !line.includes('echarts.use') &&
        !line.includes('echarts.init') &&
        !line.includes('chart.setOption')
    )
    .join('\n');

  // Run the code
  try {
    // Load d3 and d3-contour using dynamic import
    const d3 = await import('d3');
    const d3Contour = await import('d3-contour');

    // Assign d3 and d3Contour to the global object
    globalThis.d3 = d3;
    globalThis.d3Contour = d3Contour;

    eval(code);
    // To make sure text is readable in dark mode
    option.backgroundColor = '#fff';
    chart.setOption(option);
  } catch (error) {
    console.error(chalk.red(error.stack));
    console.info(chalk.blue(code));
    return;
  }

  const svg = chart.renderToSVGString();

  chart.dispose();
  chart = null;
  option = null;

  // Save the SVG to file
  fs.writeFileSync(outputPath, svg);
}