How can I update my outdated manifest v2 code to manifest v3 for my Google Chrome Extension?

Currently, I am developing an extension and using a template from a previous YouTube video that is based on manifest v2. However, I am implementing manifest v3 in my extension. Can anyone guide me on how to update this specific piece of code?

"background": {
    "service_worker":
        "popup.js",
        "persistent": true
},

Upon testing the extension in Chrome, I encountered the following error:

Failed to load extension
File: ~/Chrome extenions /BackgroundChanger
Error: The "background.persistent" key cannot be used with manifest_version 3. Use the "background.service_worker" key instead.
Could not load manifest.

I assumed that manifest v2 and v3 would have some similarities but seems like there are significant differences.

javascriptcssjsonchrome-extension-manifest-v3

Answer №1

For more information on transitioning to the new extension model, check out this migration guide: https://developer.chrome.com/docs/extensions/mv3/mv3-migration/.

The issue you are facing is likely due to the presence of a scripts property within the background object. To resolve this, you should replace it with 

"service_worker": "popup.js"
.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

My API encountered a 404 error when trying to access the MAILCHIMP API

I am currently working on a project focused on creating a Newsletter for web development led by Angela Yu. In this project, I encountered a 404 error while integrating the API from the MAILCHIMP website. Each time I tried to insert the API, it consistent ...

javascriptnode.jsexpressbody-parser

Issue encountered while creating a token in a JavaScript Chrome extension and attempting to validate it on a backend Node.js server

Trying to create a token within a chrome extension and utilizing it to authenticate requests to the backend server has proven challenging. While successfully generating a token on the front end, encountering an error when verifying it with the google-auth- ...

javascriptnode.jsgoogle-chrome-extensiongoogle-oauthgoogle-auth-library-nodejs

methods for transferring information from a website to a smartphone using SMS

I am currently in the early stages of learning JavaScript and working on a project that involves creating a form (a web page) to send data to my mobile device via SMS when the submit button is clicked. However, I am unsure how to transfer data from JavaS ...

javascriptjavahtmlweb-development-server

Select multiple rows by checking the checkboxes and select a single row by clicking on it in the MUI DataGrid

I am currently utilizing the MUI DataGrid version 4 component. The desired functionalities are as follows: Allow multiple selections from the checkbox in the Data Grid (if the user selects multiple rows using the checkbox). Prevent multiple selections fr ...

javascriptreactjstypescriptdatagridmaterial-ui

Transform your dictionary into an interactive HTML table that allows users to search through the results with ease

I have a university project where I need to exchange data via JSON using a Python script and a server, and then display it in a browser with an add and search function. The information being added includes student names, surnames, and ages. I must apologiz ...

pythonhtmljson

Issues with parsing XML data when using the xml2js library

I am looking to extract and populate values from a large XML dataset into a mySQL table. The XML data structure is as follows: <BMS version="1.0"> <Summaries> <Summary Booking_strId="CWBL00D7CB8J8U" Booking_lngId="466244159" Trans_lngId="4 ...

javascriptmysqlxmlnode.jsxml-parsing

One way to have a Spring RESTful API return JSON in its true format rather than as a string is by serializing the

Currently, I am developing a RESTful API using Spring. The API structure is such that it displays all objects of its corresponding type. You can access the API at the following link: The Data Transfer Object (DTO) for this API is as follows: public class ...

jsonspringrest

Unable to utilize the "let" keyword in WebStorm

Currently, I am delving into learning typescript and attempting to create a simple 'let' statement. However, I encountered an error indicating the need to use ECMAScript 6 or later versions. The exact message from the typescript compiler states: ...

javascripttypescriptwebstorm

3D Animation for All Browsers

I'm currently working on creating a small browser-based game and I've been experimenting with animations to get the desired effect. So far, the animation works well in Opera and Edge, although there is a slight cropping issue in Edge. Unfortunat ...

javascriptjqueryhtmlcss

Having trouble retrieving the innerHTML of a span tag in a JavaScript function

I'm currently working on creating an email message that will have pre-filled text from an asp:Literal when a user clicks a link. The HTML code for this is structured like this: <tr> <td> <img src="../../images/Question.gif" ...

javascriptasp.nethtml

Sorting Columns in PrimeVue DataTable by Date and Time

I am using a PrimeVue DataTable () with the following structure: <DataTable :rows = "5" :value = "apiItems" > <Column v-for="data in columns" :field="data.field" :header="data.header&q ...

javascriptvue.jsvuejs3primevue

What sets apart importing components in computed from importing components in dynamic import in Vue.js?

Imagine there are 4 components available on a page or within a component, and the user can utilize them based on their selection by toggling between Input, Image, Video, or Vudio components. There are two ways to lazily load these components: 1) <temp ...

javascriptvue.jswebpackvuejs2

Achieving overlapping of a <div> element with a "position: fixed" container while enabling vertical scrolling of the fixed container's content

In my single page application, I have a fixed container and I am trying to make one div inside this container overlap the boundaries of the fixed container while also vertically scrolling with its contents. Unfortunately, I have only been able to achieve e ...

cssoverflowcss-position

Solutions for resolving the error "Unable to access property 'value1' because it is undefined"

constructor() { super(); this.state = { value1 : Math.floor(Math.random() * 100), value2 : Math.floor(Math.random() * 100), value3 : Math.floor(Math.random() * 100), proposedAnswer : Math.floor(Math.random() * 3) + this.state.value1 + t ...

javascriptreactjs

Efficiently obtain the necessary data

Seeking assistance and advice on an issue I'm facing. My goal is to create a function fetchUserImg that displays a user's profile picture. Initially, the user's ID comes from the event's host_id number. The component should: 1) retrieve ...

javascriptreactjsruby-on-rails-4react-redux

Firebug mistakenly detects phantom errors

<div id="video-player" data-src="http://www.youtube.com/embed..."></div> Inspect Element - Browser Developer Tools: Error: Access to property 'toString' denied I scanned the entire page (Ctrl+F) and could not find any reference t ...

javascripthtmlfirebug

Ways to obtain data in JavaScript function from HTML

Struggling to pass the key from a database query in HTML using PHP to a JavaScript function? You're not alone. The challenge lies in passing the field_id to the updateRecords() JS function through the onClick() event of an HTML button. Previously, se ...

javascriptphphtmlajax

Ways to verify AJAX Response String when data format is specified as JSON

When using AJAX to retrieve JSON data from a webpage, it's essential to set the responseType to json. If the data processing is successful, a valid JSON string is returned, which works perfectly. However, if there's an error on the webpage, inst ...

javascriptjsonajax

What is the process of utilizing multiple npm registries within Yarn?

Currently, I am facing a challenge while setting up Yarn 0.17.9 in our environment due to issues with our registry setup. Our environment involves two registries - the official npmjs registry and our own internal network registry (Sinopia). The main issue ...

javascriptnpmyarnpkg

I am facing difficulty in incorporating an IP address or URL within an IFRAME in my Cordova Android application

This page does not allow any iframes to load except for the YouTube video URL. When attempting to use any other iframe URL, the following error code is displayed: Error : net::ERR_BLOCKED_BY_RESPONSE In the example below, any URL or IP address fails to l ...

javascripthtmlcordova