Use `navigator.clipboard` api but an error was reported "Cannot read properties of undefined"

[lapse12]

Describe the bug

I tried the navigator. clipboard.writeText and navigator. clipboard.write api, which work well in the IDE, but I encountered error during testing them

TypeError: Cannot read properties of undefined (reading 'writeText')

Reproduction

minimal.zip

Steps to reproduce

pnpm i
wxt

System Info

System:
    OS: macOS 14.4.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 78.95 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.20.2 - ~/.nvm/versions/node/v18.20.2/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 10.5.0 - ~/.nvm/versions/node/v18.20.2/bin/npm
    pnpm: 8.15.4 - ~/Library/pnpm/pnpm
  Browsers:
    Chrome: 127.0.6533.89
    Safari: 17.4.1
  npmPackages:
    wxt: ^0.19.1 => 0.19.2

Used Package Manager

pnpm

Validations

• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[1natsu172]

@lapse12 Can't use clipboard API on the background script now. navigator.clipboard API doesn't exist.

So…you can exec on the browser(popup or content-scripts) or offscreen API or sendMessage hacks.

Some reference URLs are listed below.

• Cannot read clipboard from service worker in a MV3 chrome extension
  • https://issues.chromium.org/issues/40738001
• MDN Clipboard API security considerations
  • https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API#security_considerations
• Hack through Offscreen API example
  • https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/functional-samples/cookbook.offscreen-clipboard-write

[aklinker1]

I'm gonna close this as it's not an issue with WXT, but a question about how to use the clipboard API in general.