How to use conditional statements with firefox addon popups

  api, firefox-addon, html, if-statement, javascript

I am trying to create a firefox addon with javascript that shows information from an API if the website the user is currently accessing matches the website within the API, however I can not seem to get the popup to work with a conditional statement to update when the matching website is accessed. When I run the code the correct information is shown within the console.log, however the HTML calling the ID does not. Any help and explination on why this will not work would be apreciated. I can’t seem to find any explination that I understand and I couldn’t get browser_action to work:https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action

Here is the script.js file.

const currentURL = window.location.hostname;
   console.log('active: ' + currentURL);
const FPUT_URL = 'http://localhost:3000/usage_term_classification';

   async function getFPUT() { 
   
   const response = await fetch(FPUT_URL);
   const data = await response.json();
    console.log(data[0].website);
    
   if (currentURL == data[0].website) {
       console.log(test")
        document.querySelector("#warning").innerText = data[0].warning;
    } 
    else {
        document.querySelector("#other").innerText = data[0].website;
    }
   }
 getFPUT();

and the popup.html file:

<!DOCTYPE html>

<html>
<body>
<h1>Hello</h1>
<p>warning: <span id="warning"></span></p>
<p>Not added to the database yet!: <span id="other"></span></p>
<script src="script.js"></script>
</body>
</html>

any advanced guidence on this would be greatly appreciated as I feel like i’ve been running around webpages like a headless chicken trying to find what I need to do to present an API within a popup if certain conditions are met such as the website being matched. Thanks for your time.

Source: Ask Javascript Questions

LEAVE A COMMENT