after embedding online excel sheet on chrome extension popup page, it is possible to insert data to cell of embed excel sheet using JavaScript?

Question

after embedding online excel sheet on chrome extension popup page, it is possible to insert data to cell of embed excel sheet using JavaScript?

Anuradha kulatunge 0

I have tried to build a simple Chrome extension where, upon the user pressing a button on the popup window, the distance between two locations using google map is extracted and inserted into an embedded Excel file cell. However, I cannot insert a value into the embedded Excel sheet using JavaScript.

Initially, I tried using the mouse and keyboard events to copy-paste to the Excel sheet, but it did not work. Even though the mouse and keyboard events work manually, JavaScript keyboard events do not. Then I found this article text, but the JavaScript dialog box for sharing the embed option is not available for my Excel sheet.How can I handle an embedded Excel sheet using JavaScript?Java script missing on dialogbox image here

manifest.json

{
  "manifest_version": 3,
  "name": "PML Copy paste",
  "version": "1.0.0",
  "description": "Extract information ",
  "action": {
    "default_popup" : "hello.html"
  },
  "permissions": ["activeTab","scripting"]
}

hello.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>PML Cal</title>
    <style>
        /* Button Style */
        .button {
          display: inline-block;
          padding: 10px 20px;
          font-size: 16px;
          font-weight: bold;
          text-transform: uppercase;
          text-decoration: none;
          color: #ffffff;
          background-color: #4CAF50;
          border: 2px solid #4CAF50;
          border-radius: 25px;
          transition: all 0.3s ease;
        }
        .button:hover {
          background-color: #45a049;
          border-color: #45a049;
        }
        /* Optional: Add more styles to make it more attractive */
        .button:active {
          transform: translateY(2px);
        }
        .button:focus {
          outline: none;
        }
        /* Optional: Add responsiveness */
        @media screen and (max-width: 600px) {
          .button {
            font-size: 14px;
            padding: 8px 16px;
          }
        }
    </style>
</head>
<body>
    <h1>PML Price Calculator</h1>
    <!-- Button HTML -->
    <div><a href="#"  class="button" id="CatchDistance">Catch Distance</a></div>
    <div style="margin: 20px;">
    </div>
    <iframe  width="1500" height="650" frameborder="0" scrolling="no" src="https://dimogroup.sharepoint.com/teams/PickMyLoadCostCalculator/_layouts/15/Doc.aspx?sourcedoc={4d0d4740-bb58-464f-9a17-d34af1e7ed66}&action=embedview&wdAllowInteractivity=False&AllowTyping=True&ActiveCell='CAL'!S14&Item=i_pml&wdInConfigurator=True&wdInConfigurator=True"></iframe>
    <script src="CatchDistance.js"></script>
</body>
</html>

CatchDistance.js

document.addEventListener('DOMContentLoaded', function() {
  var extractButton = document.getElementById('CatchDistance');
  extractButton.addEventListener('click', function() {
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
      chrome.scripting.executeScript({
        target: {tabId: tabs[0].id},
        function: function() {
          var elementValue = document.querySelector("#section-directions-trip-0 > div.MespJc > div > div.XdKEzd > div.ivN21e.tUEI8e.fontBodyMedium > div").textContent;
          return elementValue;
        }
      }, function(results) {
        alert(results[0].result);
      });
    });
  });
});

Share via

after embedding online excel sheet on chrome extension popup page, it is possible to insert data to cell of embed excel sheet using JavaScript?

Your answer