background like content to pass messages and get the return result is always null

[asasas234]

I tried to send a message from the background to the content script and get the result returned by the content script, but it always returns empty. However, I debugged in the content script and confirmed that there is data returned, so I'm not sure where I went wrong.

The following is my code

background.ts

 let result = await browser.tabs.sendMessage(id, { method: "request", payload: null })
        // 如果收到有效响应，则处理数据
        if (result != null) {
            debugger
            await process(result);
        }

content.ts

browser.runtime.onMessage.addListener( (request) => {
            if (request.method === 'request') {
                if (this.bufferQueue.length > 0) {
                    return this.bufferQueue.shift()
                }
            }
            return true
        })

The return value of this.bufferQueue.shift() is not empty. The return value is a 2-dimensional array, but on the background side, the result is always null.

In addition, I configured the tabs permission in wxt.config.ts. May I ask where did I go wrong?

[aiktb]

https://developer.chrome.com/docs/extensions/reference/api/runtime#event-onMessage

(message: any, sender: MessageSender, sendResponse: function) => boolean | undefined

Please using sendResponse:

// Example of a simple user data object
const user = {
  username: 'demo-user'
};

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  // 2. A page requested user data, respond with a copy of `user`
  if (message === 'get-user-data') {
    sendResponse(user);
  }
});

Note: Using tabs.sendMessage does not require the tabs permission. Please add the permission only when needed, such as to get additional information in the return value of tabs.query or to manipulate the tab.

[asasas234]

@aiktb I tried but it didn't work.

browser.runtime.onMessage.addListener(  (request, sender, sendResponse) => {
            if (request.method === 'request') {
                if (this.bufferQueue.length > 0) {
                    let result = this.bufferQueue.shift();
                    sendResponse(result)
                } else {
                    sendResponse()
                }
            }
            return true
        })

[asasas234]

@aiktb I succeeded, thank you very much. It turns out that changing the browser back to Chrome did the trick. But does this mean it's a bug in WXT? Is there a way to achieve this using WXT?

[asasas234]

@aiktb I succeeded, thank you very much. It turns out that changing the browser back to Chrome did the trick. But does this mean it's a bug in WXT? Is there a way to achieve this using WXT?

What does "back to Chrome" mean? Are you using Firefox? This is not a WXT issue.

I want to express that my code starts like this:

browser.runtime.onMessage.addListener

However, the data transmission always failed, so I changed it to the following and it worked normally.

chrome.runtime.onMessage.addListener

But I know that wxt development is recommended to write browser.xxx in order to be compatible with other browsers, so I want to know how to solve this problem through browser.xxx.

[1natsu172]

browser.runtime.onMessage.addListener((request) => {
            if (request.method === 'request') {
                if (this.bufferQueue.length > 0) {
                    let result = this.bufferQueue.shift();
                    return Promise.resolve(result);
                } 
            }
        })

@asasas234 What happens when you try to return a Promise?

ref: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/runtime/onMessage#addlistener_syntax

[asasas234]

browser.runtime.onMessage.addListener((request) => {
            if (request.method === 'request') {
                if (this.bufferQueue.length > 0) {
                    let result = this.bufferQueue.shift();
                    return Promise.resolve(result);
                } 
            }
        })

@asasas234 What happens when you try to return a Promise?

ref: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/runtime/onMessage#addlistener_syntax

Always get null in the backscript script.

[1natsu172]

Hmm...If there are other listeners, the messages could be mixed up. Do you get the same problem with minimal reproduction? (If there really is a bug, I guess it's in webextension-polyfill.)

[aklinker1]

The poly fill has some weird behavior when it comes to messaging... But it is possible to do, add@1natsu172 showed. You have to be very careful with async.

If you want to remove the polyfill completely, follow #868, and continue using WXT's browser export. I'm looking for feedback on the extensionApi feature!