It was quite easy to follow along and understand as a beginner. But I have a doubt regarding the "page.service.js" file. What is that file actually? If I rename it to say just "page.js" at appropriate places, the code breaks and suddenly it cannot find the PageService.savePage function in "background.js" script. Can anyone explain? Links to further resources on the same will be much appreciated. Thank you.
Hi Dilbwag! The page.service.js is a regular file containing a class. I just got into the habit of naming my data access files using the suffix .service, but it could've been called page-service.js too, for example.
The reason your code breaks when you change the file's name is that you must also change the references to the file in the following places:
manifest.json: Where you declare the background scripts, search for the page.service.js entry at the end of the scripts array and replace it with the new filename (e.g. page.js)
popup.html: At the end of the body tag, we added a script tag referencing page.service.js. It should be replaced to reference the new filename.
Updating the filename in those 2 places should do it. Hope it helps! :)
Yes! You read my mind 😂 I'm actually working on an article about Manifest V3 right now. My plan is to do an overview and then go through the steps to migrate this sample extension to v3 :)
It was quite easy to follow along and understand as a beginner. But I have a doubt regarding the "page.service.js" file. What is that file actually? If I rename it to say just "page.js" at appropriate places, the code breaks and suddenly it cannot find the PageService.savePage function in "background.js" script. Can anyone explain? Links to further resources on the same will be much appreciated. Thank you.
Hi Dilbwag! The
page.service.js
is a regular file containing a class. I just got into the habit of naming my data access files using the suffix.service
, but it could've been calledpage-service.js
too, for example.The reason your code breaks when you change the file's name is that you must also change the references to the file in the following places:
manifest.json
: Where you declare the background scripts, search for thepage.service.js
entry at the end of thescripts
array and replace it with the new filename (e.g.page.js
)popup.html
: At the end of thebody
tag, we added a script tag referencingpage.service.js
. It should be replaced to reference the new filename.Updating the filename in those 2 places should do it. Hope it helps! :)
It does work now. Thank you so much. Also, are you planning on continuing this series for updating it to manifest V3?
Yes! You read my mind 😂 I'm actually working on an article about Manifest V3 right now. My plan is to do an overview and then go through the steps to migrate this sample extension to v3 :)
Cool😁 Will be waiting for it!!!