HTML/CSS/JS のアニメーションをそのままmp4の動画にする方法

実現したいこと

HTML/CSS/JavaScript　で作ったアニメーションをそのままmp4の動画にしたい。
アニメーションの速度をWeb上の実際の速度に維持したまま動画にしたい。

前提

サーバーで動作する動画制作のアプリケーションを作成しており、CSSやJSで作ったアニメーションをそのまま動画にしたいです。

canvas ではCSSなどのアニメーションを適用できないので、DOM要素に対して画像やテキストなどを配置し、それを指定した範囲（1920*1080 など）でキャプチャし、動画化したいです。

様々な方法を調べていますがなかなかうまく行かず、良い方法がないか、教えていただきたいです。

バックエンドの言語は Node.js および Python を試しています。

発生している問題・エラーメッセージ

まず最初は、スクリーンレコードを試しましたが、撮影範囲の指定がうまく行かず、タブなどやブックマークバーを巻き込んでしまいきれいに取れなさそうでした。

次に、MediaDevices.getDisplayMedia() を試しましたが、こちらも画面全体を取ってしまいうまく行きませんでした。

その後、MediaStream Recording API　を試しましたが、canvas や video 要素しか stream に送れないようでした。

次に、pupeteer を使って特定のWebサイト（またはHTML）にアクセスし、スクリーンショットを指定したfpsで撮影し、それをffmpegで動画化する仕組みを作り、動画自体はできましたが、動画上のアニメーションのスピードがのWeb上のスピードよりもかなり速くなってしまいました。

ほぼ同様の仕組みを持つtimesnap でも試しましたが、以下の issue の通り、同様の状態になってしまいます。
https://github.com/tungs/timesnap/issues/76

該当のソースコード

timesnap を試したときのコードがこれです。（issue のものと同様。）

javascript
1const generateVideo = async (videoPath, url, selector, duration = 15, width = 1920, height = 1080, fps = 30,
2    frameDir = 'frames', framePattern = "image%04d.png") => {
3
4    console.log(`*will create ${videoPath} by ${selector} of ${url}`);
5
6    console.log("*will screenshot with timesnap");
7    await timesnap({
8        url,
9        viewport: {
10            width, height
11        },
12        selector,
13
14        width, height,
15
16        fps,
17        duration,
18        outputDirectory: frameDir,
19        outputPattern: framePattern
20    });
21
22    console.log("*finish screenshot");
23
24
25    console.log("*img to video with ffmpeg");
26
27    const command = `ffmpeg -y -r ${fps} -i ${frameDir}/${framePattern} -c:v libx264 -vf "fps=30,format=yuv420p" ${videoPath}`;
28
29    try {
30        await executeFFmpegCommand(command);
31        console.log("*finish img to video");
32    } catch(err) {
33        console.error(`***Failed to execute FFmpeg command: ${err}`);
34    }
35
36    console.log("*cleaning up screenshots");
37    // cleanDirFiles(frameDir);
38
39    console.log("*finish all process");
40
41}