added preview script

LiveDuo · LiveDuo · commit 4f0c8d012052 · 2023-07-01T22:31:38.000+03:00
diff --git a/package.json b/package.json
@@ -24,6 +24,7 @@
     "build:react": "npm run build -w lib && npm run build -w dev/react-project",
     "analyze": "ANALYZE=true npm run build:next",
     "screenshots": "npm run screenshots -w scripts",
+    "preview": "npm run preview -w scripts",
     "pretty": "pretty-quick --staged",
     "test:e2e": "npm run test:e2e:next && npm run test:e2e:react",
     "test:e2e:next": "npm run test:e2e:dev:next && npm run test:e2e:build:next",
diff --git a/scripts/package.json b/scripts/package.json
@@ -3,7 +3,8 @@
   "version": "1.0.0",
   "description": "",
   "scripts": {
-    "screenshots": "node ./screenshots.js"
+    "screenshots": "node ./screenshots.js",
+    "preview": "node ./preview.js"
   },
   "author": "",
   "license": "ISC",
diff --git a/scripts/preview.js b/scripts/preview.js
@@ -0,0 +1,37 @@
+const puppeteer = require('puppeteer')
+const fs = require('fs/promises')
+const process = require('process')
+
+const tailwindUrl = 'https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css'
+
+const componentsPath = process.cwd() + '/../lib/themes'
+const themeName = process.argv[2]
+if (!themeName) throw new Error('No theme name')
+
+const componentName = process.argv[3]
+if (!componentName)
+  throw new Error('No component name')
+
+  // npm run preview -- hyperui Banner1
+;(async () => {
+  // create page
+  const browser = await puppeteer.launch({ headless: false })
+  const page = await browser.newPage()
+
+  // render html
+  const source = await fs.readFile(
+    `${componentsPath}/${themeName}/${componentName}/index.html`,
+    'utf8',
+  )
+  const html = `<html><head><link rel="stylesheet" href="${tailwindUrl}"></head><body>${source.replaceAll(
+    '`',
+    '',
+  )}</body></html>`
+  await page.setContent(html)
+
+  // wait for a long time
+  await new Promise((r) => setTimeout(r, 50000))
+
+  // close page
+  await browser.close()
+})()
