크롬 익스텐션을 업데이트해보자 feat 네이버 웹툰 북마크

typescriptimport { $ } from 'bun'
import { resolve } from 'node:path'
 
console.log(resolve(__dirname, '../'))
$.cwd(resolve(__dirname, '../'))

typescriptimport Bun, { $, Glob } from 'bun'
 
import manifest from '../public/manifest.json'
import './cwd'
 
const outdir = './build'
const { content_scripts } = manifest
const scripts = content_scripts.flatMap((script) => script.js)
const publicFolder = './public'
 
const resolveEntryPoints = (entrypoints: string[]) => entrypoints.map((entrypoint) => `./src/${entrypoint}`)
 
await $`rm -rf ${outdir}`
 
const ext = {
    html: '.html',
    png: '.png',
    css: '.css',
}
 
await Bun.build({
    target: 'browser',
    entrypoints: resolveEntryPoints([...scripts, 'popup/index.tsx']),
    outdir,
})
 
const glob = new Glob('**')
const globalCssFile = Bun.file(`${publicFolder}/global.css`)
 
if (!globalCssFile.exists()) throw new Error('global.css not found')
 
for await (const filename of glob.scan(publicFolder)) {
    const file = Bun.file(`${publicFolder}/${filename}`)
 
    if (!file.exists()) throw new Error(`File ${filename} does not exist`)
 
    if (filename.endsWith(ext.png) || filename.endsWith(ext.css)) continue
 
    if (filename.endsWith(ext.html)) {
        const fileFolder = filename.replace(ext.html, '')
 
        await $`mkdir -p ${outdir}/${fileFolder}`
 
        await $`cp ${file.name} ${outdir}/${fileFolder}/index.html`
 
        await $`bun run css -- ${globalCssFile.name} -o ${outdir}/${fileFolder}/global.css`.quiet()
    } else {
        await $`cp ${file.name} ${outdir}`
    }
}
 
await $`cp -R ${publicFolder}/icons ${outdir}`
 

typescriptexport const channel = 'reload-extension'
 
export const server = Bun.serve({
    fetch(req, server) {
        const url = new URL(req.url)
 
        if (url.pathname === '/listen') {
            const upgraded = server.upgrade(req)
 
            if (!upgraded) {
                return new Response('Upgrade failed', { status: 400 })
            }
        }
        return new Response('Hello, world!')
    },
    websocket: {
        open(ws) {
            ws.subscribe(channel)
        },
        message(_, message) {
            server.publish(channel, message)
        },
        close(ws) {
            ws.unsubscribe(channel)
        },
    },
    port: 8080,
})
 

typescriptimport Bun, { $ } from 'bun'
import { parseArgs } from 'util'
import { watch } from 'fs'
import type { FSWatcher } from 'fs'
import chalk from 'chalk'
 
import './cwd'
import { server, channel } from './server'
 
const {
    values: { dir },
} = parseArgs({
    args: Bun.argv,
    strict: true,
    allowPositionals: true,
    options: {
        dir: {
            type: 'string',
        },
    },
})
 
const directoriesToWatch = dir?.split(',').map((dir) => `./${dir}`) || []
 
const runBuild = async () => $`bun run config/build.ts`
await runBuild()
 
const directories = directoriesToWatch.join(', ')
const defaultWatchMessage = `Watching ${directories} directories for changes...`
 
console.log(chalk.bold(defaultWatchMessage))
 
const watchers: FSWatcher[] = []
 
for (const directory of directoriesToWatch) {
    const watcher = watch(directory, { recursive: true }, async (_, filename) => {
        console.log(chalk.bold.yellow.dim(`Changes detected in ${filename}`))
 
        await runBuild()
        console.log(chalk.bold.green('✔️ Updated build files'))
 
        server.publish(channel, Bun.env.CHROME_EXTENSION_ID as string)
 
        console.log(chalk.bold(defaultWatchMessage))
    })
 
    watchers.push(watcher)
}
 
process.on('SIGINT', () => {
    for (const watcher of watchers) {
        watcher.close()
    }
 
    process.exit(0)
})
 

typescriptimport Bun, { $ } from 'bun'
import AdmZip from 'adm-zip'
import manifest from '../public/manifest.json'
 
import './cwd'
 
await $`bun run ./config/build.ts`
 
const packName = manifest.name.toLowerCase().replace(/[\s\W]+/g, '-')
 
const { version } = manifest
 
const folderToCompress = './build'
const outputArchive = `./release/${packName}-v${version}.zip`
 
const zip = new AdmZip()
 
zip.addLocalFolder(folderToCompress)
zip.writeZip(outputArchive)
 
console.log(`Folder compressed into ${outputArchive}`)
 

typescriptconst observeBody = () => {
    const body = document.body
    if (!body) return
 
    let observer: MutationObserver
    const observe = () => {
        observer = new MutationObserver(() => {
            if (document.getElementById('container')) {
                sendDOMData()
                observer.disconnect()
                setTimeout(observe)
            }
        })
        observer.observe(body, { childList: true, subtree: true })
    }
    observe()
}

typescriptconst state = new Proxy(
    {
        isBookmark: false,
        bookmarks: [] as string[],
    },
    {
        set(target, key, value) {
            target[key as keyof typeof target] = value
            if (key === 'isBookmark') {
                toggleWebtoonList()
            }
            return true
        },
    },
)