Fix clean function

cezaraugusto · cezaraugusto · commit 6aa770f1e160 · 2025-06-09T20:46:35.000-03:00
diff --git a/.github/CODE_OF_CONDUCT.md b/.github/CODE_OF_CONDUCT.md
@@ -1,4 +1,3 @@
-
 # Code of Conduct
 
 ## Our Pledge
@@ -18,23 +17,23 @@ diverse, inclusive, and healthy community.
 Examples of behavior that contributes to a positive environment for our
 community include:
 
-* Demonstrating empathy and kindness toward other people
-* Being respectful of differing opinions, viewpoints, and experiences
-* Giving and gracefully accepting constructive feedback
-* Accepting responsibility and apologizing to those affected by our mistakes,
+- Demonstrating empathy and kindness toward other people
+- Being respectful of differing opinions, viewpoints, and experiences
+- Giving and gracefully accepting constructive feedback
+- Accepting responsibility and apologizing to those affected by our mistakes,
   and learning from the experience
-* Focusing on what is best not just for us as individuals, but for the overall
+- Focusing on what is best not just for us as individuals, but for the overall
   community
 
 Examples of unacceptable behavior include:
 
-* The use of sexualized language or imagery, and sexual attention or advances of
+- The use of sexualized language or imagery, and sexual attention or advances of
   any kind
-* Trolling, insulting or derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or email address,
+- Trolling, insulting or derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or email address,
   without their explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
+- Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ## Enforcement Responsibilities
diff --git a/README.md b/README.md
@@ -1,14 +1,14 @@
 [npm-version-image]: https://img.shields.io/npm/v/extension.svg?color=0971fe
 [npm-version-url]: https://www.npmjs.com/package/extension
-[downloads-image]: https://img.shields.io/npm/dm/extension.svg
+[downloads-image]: https://img.shields.io/npm/dm/extension.svg?color=2ecc40
 [downloads-url]: https://npmjs.org/package/extension
-[action-image]: https://github.com/extension-js/extension.js/actions/workflows/ci.yml/badge.svg?branch=main
+[action-image]: https://github.com/extension-js/extension.js/actions/workflows/ci.yml/badge.svg?branch=main&color=2ecc40
 [action-url]: https://github.com/extension-js/extension.js/actions
-[coverage-image]: https://img.shields.io/codecov/c/github/extension-js/extension.js
+[coverage-image]: https://img.shields.io/codecov/c/github/extension-js/extension.js?color=2ecc40
 [coverage-url]: https://codecov.io/github/extension-js/extension.js
-[discord-image]: https://img.shields.io/discord/1253608412890271755?label=Discord&logo=discord&style=flat
+[discord-image]: https://img.shields.io/discord/1253608412890271755?label=Discord&logo=discord&style=flat&color=2ecc40
 [discord-url]: https://discord.gg/v9h2RgeTSN
-[snyk-image]: https://snyk.io/test/github/extension-js/extension/badge.svg
+[snyk-image]: https://snyk.io/test/github/extension-js/extension/badge.svg?color=2ecc40
 [snyk-url]: https://snyk.io/test/github/extension-js/extension
 
 > The cross-browser extension framework
diff --git a/programs/cli/README.md b/programs/cli/README.md
@@ -1,14 +1,14 @@
 [npm-version-image]: https://img.shields.io/npm/v/extension.svg?color=0971fe
 [npm-version-url]: https://www.npmjs.com/package/extension
-[downloads-image]: https://img.shields.io/npm/dm/extension.svg
+[downloads-image]: https://img.shields.io/npm/dm/extension.svg?color=2ecc40
 [downloads-url]: https://npmjs.org/package/extension
-[action-image]: https://github.com/extension-js/extension.js/actions/workflows/ci.yml/badge.svg?branch=main
+[action-image]: https://github.com/extension-js/extension.js/actions/workflows/ci.yml/badge.svg?branch=main&color=2ecc40
 [action-url]: https://github.com/extension-js/extension.js/actions
-[coverage-image]: https://img.shields.io/codecov/c/github/extension-js/extension.js
+[coverage-image]: https://img.shields.io/codecov/c/github/extension-js/extension.js?color=2ecc40
 [coverage-url]: https://codecov.io/github/extension-js/extension.js
-[discord-image]: https://img.shields.io/discord/1253608412890271755?label=Discord&logo=discord&style=flat
+[discord-image]: https://img.shields.io/discord/1253608412890271755?label=Discord&logo=discord&style=flat&color=2ecc40
 [discord-url]: https://discord.gg/v9h2RgeTSN
-[snyk-image]: https://snyk.io/test/github/extension-js/extension/badge.svg
+[snyk-image]: https://snyk.io/test/github/extension-js/extension/badge.svg?color=2ecc40
 [snyk-url]: https://snyk.io/test/github/extension-js/extension
 
 > The cross-browser extension framework
diff --git a/programs/develop/commands/build.ts b/programs/develop/commands/build.ts
@@ -40,7 +40,8 @@ export async function extensionBuild(
       browser,
       mode: 'production',
       output: {
-        clean: true
+        clean: true,
+        path: path.join(projectPath, 'dist', browser)
       }
     })
 
diff --git a/programs/develop/commands/commands-lib/config-types.ts b/programs/develop/commands/commands-lib/config-types.ts
@@ -53,6 +53,7 @@ export interface BuildOptions {
 
 export interface PreviewOptions extends BrowserOptionsBase {
   mode: 'production'
+  outputPath?: string
   chromiumBinary?: ChromiumOptions['chromiumBinary']
   geckoBinary?: GeckoOptions['geckoBinary']
 }
diff --git a/programs/develop/commands/commands-lib/get-project-path.ts b/programs/develop/commands/commands-lib/get-project-path.ts
@@ -1,4 +1,5 @@
 import * as path from 'path'
+import * as fs from 'fs'
 import goGitIt from 'go-git-it'
 import * as messages from './messages'
 import {downloadAndExtractZip} from './extract-from-zip'
diff --git a/programs/develop/commands/commands-lib/messages.ts b/programs/develop/commands/commands-lib/messages.ts
@@ -236,7 +236,7 @@ export function writingTypeDefinitionsError(error: any) {
 
 export function downloadingText(url: string) {
   return (
-    `${getLoggingPrefix('info')} Downloading extension...\n` +
+    `${getLoggingPrefix('info')} Downloading browser extension...\n` +
     `${chalk.gray('URL')} ${chalk.underline(url)}`
   )
 }
diff --git a/programs/develop/commands/preview.ts b/programs/develop/commands/preview.ts
@@ -10,7 +10,9 @@ import * as path from 'path'
 import {rspack, type Configuration} from '@rspack/core'
 import {merge} from 'webpack-merge'
 import webpackConfig from '../webpack/webpack-config'
-import {getProjectPath} from './commands-lib/get-project-path'
+import {
+  getProjectPath,
+} from './commands-lib/get-project-path'
 import * as messages from './commands-lib/messages'
 import {loadCustomWebpackConfig} from './commands-lib/get-extension-config'
 import {PreviewOptions} from './commands-lib/config-types'
@@ -20,6 +22,19 @@ export async function extensionPreview(
   previewOptions: PreviewOptions
 ) {
   const projectPath = await getProjectPath(pathOrRemoteUrl)
+  const distPath = path.join(projectPath, 'dist', previewOptions.browser)
+
+  // Output path defaults to extensionPreview config.
+  // The start command will use the build directory.
+  // The preview command will use the build directory if it exists,
+  // otherwise it will use the project path.
+  // This is useful for remote packages that don't have a build directory.
+  // but are ready for manual browser testing.
+  const outputPath = previewOptions.outputPath
+    ? previewOptions.outputPath
+    : fs.existsSync(distPath)
+      ? distPath
+      : projectPath
 
   if (
     !pathOrRemoteUrl?.startsWith('http') &&
@@ -30,7 +45,7 @@ export async function extensionPreview(
     )
     process.exit(1)
   }
-
+ 
   try {
     const browser = previewOptions.browser || 'chrome'
     const baseConfig: Configuration = webpackConfig(projectPath, {
@@ -43,7 +58,8 @@ export async function extensionPreview(
       // Preview needs a build before running so
       // we don't want to clean the output directory.
       output: {
-        clean: false
+        clean: false,
+        path: outputPath
       }
     })
 
@@ -66,9 +82,7 @@ export async function extensionPreview(
       }
 
       if (!stats?.hasErrors()) {
-        console.log(
-          messages.runningInProduction(path.join(projectPath, 'dist', browser))
-        )
+        console.log(messages.runningInProduction(projectPath))
       } else {
         console.log(stats.toString({colors: true}))
         process.exit(1)
diff --git a/programs/develop/commands/start.ts b/programs/develop/commands/start.ts
@@ -39,7 +39,9 @@ export async function extensionStart(
 
     await extensionPreview(pathOrRemoteUrl, {
       ...startOptions,
-      browser
+      browser,
+      // Starts preview the extension from the build directory
+      outputPath: path.join(projectPath, 'dist', browser)
     })
   } catch (error) {
     if (process.env.EXTENSION_ENV === 'development') {
diff --git a/programs/develop/webpack/dev-server.ts b/programs/develop/webpack/dev-server.ts
@@ -66,7 +66,8 @@ export async function devServer(projectPath: string, devOptions: DevOptions) {
     ...browserConfig,
     mode: 'development',
     output: {
-      clean: false
+      clean: false,
+      path: path.join(projectPath, 'dist', devOptions.browser)
     }
   })
 
diff --git a/programs/develop/webpack/plugin-compilation/clean-dist.ts b/programs/develop/webpack/plugin-compilation/clean-dist.ts
@@ -3,12 +3,13 @@ import * as path from 'path'
 import {type Compiler} from '@rspack/core'
 
 export class CleanDistFolderPlugin {
+  constructor(private options: {browser: string}) {}
   apply(compiler: Compiler): void {
-    const outputPath = path.join(compiler.options.output.path || '')
+    const distPath = path.join(compiler.options.context!, 'dist', this.options.browser)
 
-    if (fs.existsSync(outputPath)) {
+    if (fs.existsSync(distPath)) {
       try {
-        fs.rmSync(outputPath, {recursive: true, force: true})
+        fs.rmSync(distPath, {recursive: true, force: true})
         if (process.env.EXTENSION_ENV === 'development') {
           console.log(
             '[CleanDistFolderPlugin] Removed old hot-update files before compilation.'
diff --git a/programs/develop/webpack/plugin-compilation/index.ts b/programs/develop/webpack/plugin-compilation/index.ts
@@ -11,10 +11,12 @@ export class CompilationPlugin {
 
   public readonly manifestPath: string
   public readonly browser: PluginInterface['browser']
+  public readonly clean: boolean
 
-  constructor(options: PluginInterface) {
+  constructor(options: PluginInterface & {clean: boolean}) {
     this.manifestPath = options.manifestPath
     this.browser = options.browser || 'chrome'
+    this.clean = options.clean || true
   }
 
   public apply(compiler: Compiler): void {
@@ -26,7 +28,15 @@ export class CompilationPlugin {
       browser: this.browser
     }).apply(compiler)
 
-    new CleanDistFolderPlugin().apply(compiler)
+    // The CleanDistFolderPlugin will remove the dist folder
+    // before the compilation starts. This is a problem
+    // for preview mode, where we don't want to clean the
+    // folder that is being used by the preview server.
+    if (this.clean) {
+      new CleanDistFolderPlugin({
+        browser: this.browser || 'chrome'
+      }).apply(compiler)
+    }
 
     compiler.hooks.done.tapAsync('develop:brand', (stats, done) => {
       stats.compilation.name = undefined
diff --git a/programs/develop/webpack/plugin-extension/feature-html/__spec__/steps/ensure-hmr-for-scripts.spec.ts b/programs/develop/webpack/plugin-extension/feature-html/__spec__/steps/ensure-hmr-for-scripts.spec.ts
@@ -28,8 +28,7 @@ describe('ensureHMRForScripts', () => {
         manifestPath: '/project/manifest.json',
         includeList: {
           feature: 'resource.html'
-        },
-        test: 'test'
+        }
       }),
       resourcePath: '/project/scripts/app.js'
     }
@@ -82,21 +81,7 @@ describe('ensureHMRForScripts', () => {
   it('should throw error for invalid options', () => {
     loaderContext.getOptions.mockReturnValue({
       manifestPath: '/project/manifest.json',
-      includeList: 'invalid', // Should be an object
-      test: 'test'
-    })
-
-    expect(() => {
-      ensureHMRForScripts.call(loaderContext, 'console.log("test")')
-    }).toThrow()
-  })
-
-  it('should handle missing manifest path', () => {
-    loaderContext.getOptions.mockReturnValue({
-      includeList: {
-        feature: 'resource.html'
-      },
-      test: 'test'
+      includeList: 'invalid' // Should be an object
     })
 
     expect(() => {
@@ -109,8 +94,7 @@ describe('ensureHMRForScripts', () => {
       manifestPath: '/project/manifest.json',
       includeList: {
         feature: undefined
-      },
-      test: 'test'
+      }
     })
 
     const result = ensureHMRForScripts.call(
@@ -235,38 +219,22 @@ describe('ensureHMRForScripts', () => {
   })
 
   it('should handle invalid schema properties', () => {
-    loaderContext.getOptions.mockReturnValue({
-      manifestPath: '/project/manifest.json',
-      includeList: {
-        feature: 'resource.html'
-      },
-      test: 123 // Should be a string
-    })
-
-    expect(() => {
-      ensureHMRForScripts.call(loaderContext, 'console.log("test")')
-    }).toThrow()
-  })
-
-  it('should handle missing test property', () => {
     loaderContext.getOptions.mockReturnValue({
       manifestPath: '/project/manifest.json',
       includeList: {
         feature: 'resource.html'
       }
-      // Missing test property
     })
 
     expect(() => {
       ensureHMRForScripts.call(loaderContext, 'console.log("test")')
-    }).toThrow()
+    }).not.toThrow()
   })
 
   it('should handle malformed error messages', () => {
     loaderContext.getOptions.mockReturnValue({
       manifestPath: '/project/manifest.json',
-      includeList: null, // Invalid type
-      test: 'test'
+      includeList: null // Invalid type
     })
 
     expect(() => {
@@ -328,8 +296,7 @@ describe('ensureHMRForScripts', () => {
   it('should handle empty includeList', () => {
     loaderContext.getOptions.mockReturnValue({
       manifestPath: '/project/manifest.json',
-      includeList: {},
-      test: 'test'
+      includeList: {}
     })
 
     const result = ensureHMRForScripts.call(
@@ -362,8 +329,7 @@ describe('ensureHMRForScripts', () => {
       manifestPath: '/project/manifest.json',
       includeList: {
         feature: 'resource.html'
-      },
-      test: 'test'
+      }
     })
 
     // Mock compilation error
diff --git a/programs/develop/webpack/plugin-extension/feature-html/html-lib/parse5-utilities b/programs/develop/webpack/plugin-extension/feature-html/html-lib/parse5-utilities
@@ -0,0 +1 @@
+Subproject commit 61556a4917863645031ac3e26b308df327389f0a
diff --git a/programs/develop/webpack/plugin-extension/feature-html/steps/ensure-hmr-for-scripts.ts b/programs/develop/webpack/plugin-extension/feature-html/steps/ensure-hmr-for-scripts.ts
@@ -9,8 +9,10 @@ import {isUsingJSFramework} from '../../../lib/utils'
 
 const schema: Schema = {
   type: 'object',
-  required: ['manifestPath', 'includeList'],
   properties: {
+    test: {
+      type: 'string'
+    },
     manifestPath: {
       type: 'string'
     },
diff --git a/programs/develop/webpack/webpack-config.ts b/programs/develop/webpack/webpack-config.ts

Original file line number	Diff line number	Diff line change
`@@ -40,7 +40,8 @@ export async function extensionBuild(`
`40`	`40`	`browser,`
`41`	`41`	`mode: 'production',`
`42`	`42`	`output: {`
`43`		`- clean: true`
	`43`	`+ clean: true,`
	`44`	`+ path: path.join(projectPath, 'dist', browser)`
`44`	`45`	`}`
`45`	`46`	`})`
`46`	`47`
Original file line number	Diff line number	Diff line change
`@@ -53,6 +53,7 @@ export interface BuildOptions {`
`53`	`53`
`54`	`54`	`export interface PreviewOptions extends BrowserOptionsBase {`
`55`	`55`	`mode: 'production'`
	`56`	`+ outputPath?: string`
`56`	`57`	`chromiumBinary?: ChromiumOptions['chromiumBinary']`
`57`	`58`	`geckoBinary?: GeckoOptions['geckoBinary']`
`58`	`59`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`import * as path from 'path'`
	`2`	`+import * as fs from 'fs'`
`2`	`3`	`import goGitIt from 'go-git-it'`
`3`	`4`	`import * as messages from './messages'`
`4`	`5`	`import {downloadAndExtractZip} from './extract-from-zip'`
Original file line number	Diff line number	Diff line change
`@@ -236,7 +236,7 @@ export function writingTypeDefinitionsError(error: any) {`
`236`	`236`
`237`	`237`	`export function downloadingText(url: string) {`
`238`	`238`	`return (`
`239`		- `${getLoggingPrefix('info')} Downloading extension...\n` +
	`239`	+ `${getLoggingPrefix('info')} Downloading browser extension...\n` +
`240`	`240`	`${chalk.gray('URL')} ${chalk.underline(url)}`
`241`	`241`	`)`
`242`	`242`	`}`
Original file line number	Diff line number	Diff line change
`@@ -66,7 +66,8 @@ export async function devServer(projectPath: string, devOptions: DevOptions) {`
`66`	`66`	`...browserConfig,`
`67`	`67`	`mode: 'development',`
`68`	`68`	`output: {`
`69`		`- clean: false`
	`69`	`+ clean: false,`
	`70`	`+ path: path.join(projectPath, 'dist', devOptions.browser)`
`70`	`71`	`}`
`71`	`72`	`})`
`72`	`73`