feat: add CI for publishing chrome extension (#1568)
* fix: remove the permission not needed and update the player style link * fix: change the way of importing worker script * improve the extension version * build: add process env to disable inline worker import * improve style file * upgrade svelte2tsx * disable eslint check for that line * merge the extension-release action into release action --------- Co-authored-by: YunFeng0817 <YunFeng0817@users.noreply.github.com>
This commit is contained in:
Yun Feng
@@ -19,9 +19,12 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rrweb/types": "^2.0.0-alpha.18",
|
||||
"@types/chrome": "^0.0.287",
|
||||
"@types/react-dom": "^18.0.6",
|
||||
"@types/semver": "^7.5.8",
|
||||
"@types/webextension-polyfill": "^0.9.1",
|
||||
"@vitejs/plugin-react": "^4.2.1",
|
||||
"semver": "^7.6.3",
|
||||
"type-fest": "^2.19.0",
|
||||
"vite": "^5.3.1",
|
||||
"vite-plugin-web-extension": "^4.1.3",
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import Browser, { type Storage } from 'webextension-polyfill';
|
||||
import Browser from 'webextension-polyfill';
|
||||
import { nanoid } from 'nanoid';
|
||||
import type { eventWithTime } from '@rrweb/types';
|
||||
import {
|
||||
@@ -166,9 +166,7 @@ async function initMainPage() {
|
||||
async function initCrossOriginIframe() {
|
||||
Browser.storage.local.onChanged.addListener((change) => {
|
||||
if (change[LocalDataKey.recorderStatus]) {
|
||||
const statusChange = change[
|
||||
LocalDataKey.recorderStatus
|
||||
] as Storage.StorageChange;
|
||||
const statusChange = change[LocalDataKey.recorderStatus];
|
||||
const newStatus =
|
||||
statusChange.newValue as LocalData[LocalDataKey.recorderStatus];
|
||||
if (newStatus.status === RecorderStatus.RECORDING) startRecord();
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
"48": "icon48.png",
|
||||
"128": "icon128.png"
|
||||
},
|
||||
"permissions": ["activeTab", "tabs", "storage", "unlimitedStorage"]
|
||||
"permissions": ["activeTab", "storage", "unlimitedStorage"]
|
||||
},
|
||||
"v2": {
|
||||
"common": {
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
/// <reference types="chrome"/>
|
||||
import { useRef, useEffect, useState } from 'react';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import Replayer from 'rrweb-player';
|
||||
@@ -29,9 +30,10 @@ export default function Player() {
|
||||
.then((events) => {
|
||||
if (!playerElRef.current) return;
|
||||
|
||||
const manifest = chrome.runtime.getManifest();
|
||||
const rrwebPlayerVersion = manifest.version_name || manifest.version;
|
||||
const linkEl = document.createElement('link');
|
||||
linkEl.href =
|
||||
'https://cdn.jsdelivr.net/npm/rrweb-player@latest/dist/style.css';
|
||||
linkEl.href = `https://cdn.jsdelivr.net/npm/rrweb-player@${rrwebPlayerVersion}/dist/style.min.css`;
|
||||
linkEl.rel = 'stylesheet';
|
||||
document.head.appendChild(linkEl);
|
||||
playerRef.current = new Replayer({
|
||||
@@ -46,6 +48,7 @@ export default function Player() {
|
||||
console.error(err);
|
||||
});
|
||||
return () => {
|
||||
// eslint-disable-next-line
|
||||
playerRef.current?.pause();
|
||||
};
|
||||
}, [sessionId]);
|
||||
|
||||
@@ -1,9 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8" />
|
||||
<title>rrweb</title>
|
||||
<html>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
<script type="module" src="./index.tsx"></script>
|
||||
</html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>rrweb</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
<script type="module" src="./index.tsx"></script>
|
||||
|
||||
</html>
|
||||
@@ -4,6 +4,7 @@ import zip from 'vite-plugin-zip-pack';
|
||||
import * as path from 'path';
|
||||
import type { PackageJson } from 'type-fest';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import semver from 'semver';
|
||||
|
||||
const emptyOutDir = !process.argv.includes('--watch');
|
||||
|
||||
@@ -39,6 +40,29 @@ function useSpecialFormat(
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the extension version based on the rrweb version.
|
||||
*/
|
||||
function getExtensionVersion(rrwebVersion: string): string {
|
||||
const parsedVersion = semver.parse(rrwebVersion.replace('^', ''));
|
||||
|
||||
if (!parsedVersion) {
|
||||
throw new Error('Invalid version format');
|
||||
}
|
||||
|
||||
if (parsedVersion.prerelease.length > 0) {
|
||||
// If it's a pre-release version like alpha or beta, strip the pre-release identifier
|
||||
return `${parsedVersion.major}.${parsedVersion.minor}.${
|
||||
parsedVersion.patch
|
||||
}.${parsedVersion.prerelease[1] || 0}`;
|
||||
} else if (rrwebVersion === '2.0.0') {
|
||||
// This version has already been released as the first version. We need to add a patch version to it to avoid publishing conflicts.
|
||||
return '2.0.0.100';
|
||||
} else {
|
||||
return rrwebVersion;
|
||||
}
|
||||
}
|
||||
|
||||
export default defineConfig({
|
||||
root: 'src',
|
||||
// Configure our outputs - nothing special, this is normal vite config
|
||||
@@ -73,10 +97,11 @@ export default defineConfig({
|
||||
const BrowserName =
|
||||
process.env.TARGET_BROWSER === 'chrome' ? 'chrome' : 'firefox';
|
||||
const commonManifest = originalManifest.common;
|
||||
const rrwebVersion = packageJson.dependencies!.rrweb!.replace('^', '');
|
||||
const manifest = {
|
||||
version: '2.0.0',
|
||||
version: getExtensionVersion(rrwebVersion),
|
||||
author: packageJson.author,
|
||||
version_name: packageJson.dependencies?.rrweb?.replace('^', ''),
|
||||
version_name: rrwebVersion,
|
||||
...commonManifest,
|
||||
};
|
||||
Object.assign(
|
||||
@@ -92,7 +117,7 @@ export default defineConfig({
|
||||
watchIgnored: ['*.md', '*.log'],
|
||||
},
|
||||
additionalInputs: ['pages/index.html', 'content/inject.ts'],
|
||||
}),
|
||||
}) as PluginOption,
|
||||
// https://github.com/aklinker1/vite-plugin-web-extension/issues/50#issuecomment-1317922947
|
||||
// transfer inject.ts to iife format to avoid error
|
||||
useSpecialFormat(
|
||||
|
||||
Reference in New Issue
Block a user