1

I'm attempting to pull "webId%22:%22" var string from a script tag using JS for a Chrome extension. The example I'm currently working with allows me to pull the page title.

// payload.js
chrome.runtime.sendMessage(document.title);


// popup.js
window.addEventListener('load', function (evt) {
    chrome.extension.getBackgroundPage().chrome.tabs.executeScript(null, {
        file: 'payload.js'
    });;
});

// Listen to messages from the payload.js script and write to popout.html
chrome.runtime.onMessage.addListener(function (message) {
    document.getElementById('pagetitle').innerHTML = message;


});


//HTML popup
<!doctype html>
<html>

<head>
    <title>WebID</title>
    <script src="popup.js"></script>
    <script src="testButton.js"></script>
</head>

<body>

    <button onclick="myFunction()">Try it</button>
    <p id="body"></p>

    <h3>It's working</h1>
    <p id='pagetitle'>This is where the webID would be if I could get this stupid thing to work.</p>




</body>
</html>

What I am trying to pull is the webID from below:

    <script if="inlineJs">;(function() { window.hydra = {}; hydra.state = 
JSON.parse(decodeURI("%7B%22cache%22:%7B%22Co.context.configCtx%22:%7B%22webId%22:%22gmps-salvadore%22,%22locale%22:%22en_US%22,%22version%22:%22LIVE%22,%22page%22:%22HomePage%22,%22secureSiteId%22:%22b382ca78958d10048eda00145edef68b%22%7D,%22features%22:%7B%22directivePerfSwitch%22:true,%22enable.directive.localisation%22:true,%22enable.directive.thumbnailGallery%22:true,%22enable.new.newstaticmap%22:false,%22disable.forms.webId%22:false,%22use.hydra.popup.title.override.via.url%22:true,%22enable.directive.geoloc.enableHighAccuracy%22:true,%22use.hydra.theme.service%22:true,%22disable.ajax.options.contentType%22:false,%22dealerLocator.map.use.markerClustering%22:true,%22hydra.open.login.popup.on.cs.click%22:false,%22hydra.consumerlogin.use.secure.cookie%22:true,%22use.hydra.directive.vertical.thumbnailGallery.onpopup%22:true,%22hydra.encrypt.data.to.login.service%22:true,%22disable.dealerlocator.fix.loading%22:false,%22use.hydra.date.formatting%22:true,%22use.hydra.optimized.style.directive.updates%22:false,%22hydra.click.pmp.button.on.myaccount.page%22:true,%22use.hydra.fix.invalid.combination.of.filters%22:true,%22disable.vsr.view.from.preference%22:false%7D%7D,%22store%22:%7B%22properties%22:%7B%22routePrefix%22:%22/hydra-graph%22%7D%7D%7D")); }());</script>

1 Answers1

0
  1. You have inline code in onclick attribute which won't work, see this answer.
    You can see an error message in devtools console for the popup: right-click it, then "Inspect".
    The simplest solution is to attach a click listener in your popup.js file.

  2. The popup is an extension page and thus it can access chrome.tabs.executeScript directly without chrome.extension.getBackgroundPage(), just don't forget to add the necessary permissions in manifest.json, preferably "activeTab".

  3. For such a simple data extraction you don't even need a separate content script file or messaging, just provide code string in executeScript.

chrome.tabs.executeScript({
  code: '(' + (() => {
    for (const el of document.querySelectorAll('script[if="inlineJs"]')) {
      const m = el.textContent.match(/"([^"]*%22webId%22[^"]*)"/);
      if (m) return m[1];
    }
  }) + ')()',
}, results => {
  if (!chrome.runtime.lastError && results) {
    document.querySelector('p').textContent = decodeURI(results[0]);
  }
});
wOxxOm
  • 43,497
  • 7
  • 75
  • 96