Chrome extension: Open new tab and click on button

Question

i have created an chrome extension which logs the user into his account. On the popup.html you can choose the login url (We have 2 portals EU and US) and type in your login credentials. After that you click the button "Login". Then a new tab with the url will open, and the extension will fill the login form with username and password. Then it should click the button on the new loginform, this wont work.

manifest.json

{
  "manifest_version": 2,

  "name": "mbCONNECT24 Login",
  "short_name": "MBCL_Login",
  "description": "This extension log you into your mbCONNECT24 account",
  "version": "1.7",
  "options_page": "options.html",
  "icons": { "16": "icon16.png",
             "48": "icon48.png",
            "128": "icon128.png" },
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },

  "author": "Johannes Regner <johannes.regner@mbconnectline.de>",
  "permissions": [
    "activeTab",
    "<all_urls>","*://*/*",
    "storage"

  ]
}

Popup.html

<!doctype html>
<html>
  <head>
    <title>mbCONNECT24 Login</title>
    <script src="popup.js"></script>
    <script src="options.js"></script>
    <link href="bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
    <div style="padding:20px;">
      <img src="mbconnect24.png" />
    <form>

      <div class="form-group">
        <label for="portals">Server</label>
        <select id="portals" class="form-control">
          <option value="https://rsp.mbconnect24.net/portal/">mbCONNECT24 RSP EU</option>
          <option value="https://rsp.mbconnect24.us/portal/">mbCONNECT24 RSP US</option>
        </select>
      </div>
      <div class="form-group">
        <label for="username">Username</label>
      <input type="text" class="form-control" id="username" placeholder="Username">
      </div>
      <div class="form-group">
        <label for="password">Password</label>
        <input type="password" class="form-control" id="password" placeholder="Password">
      </div>
      <button id="gotoLogin" class="btn btn-success">Login</button>
    </form>

</div>
  </body>
</html>

My code in popup.js is the following:

window.addEventListener("load", function()
{
  document.getElementById("gotoLogin")
          .addEventListener("click", gotoLogin, false);
}, false);


function gotoLogin() {
  var selectlist = document.getElementById("portals");
  var url = selectlist.value;

  var username = document.getElementById("username").value;
  var password = document.getElementById("password").value;


  var logincode = 'var loginField = document.getElementById("modlgn_username");'+
             'var passwordField = document.getElementById("modlgn_passwd");'+
             'loginField.value = "'+username+'";passwordField.value ="'+password+'";'+
             'document.getElementById("loginBtn").click();';

  var tabId = null;

  //var tabs = chrome.extension.getViews();
  //console.log(tabs);
  chrome.tabs.create({"url": url}, function(tab){
    tabId = tab.id;

    //chrome.tabs.executeScript(tab.id, {file: 'content.js', runAt: 'document_end',code: 'var myUsername = "'+username+'";'});
  });

   chrome.tabs.update(tabId, {url: url});
   chrome.tabs.executeScript(tabId, {code: logincode, runAt:"document_end",allFrames:true}, function(result){
   });

}

Maybe its the wrong way? Now it opens the new tab and fill the form, but don't click the button. If i type the command 'document.getElementById("loginBtn").click();' in console, the button will clicked.

Thank you!

Answer 1

Context scripts run in the context of web pages.

So first you need to register content script as the document said.

Then after user submit the form in popup , you can save the account info in chrome extension storage .

When the page is accessed, you can get the account info from chrome extension storage and fill them in current page.

Chrome extension: Open new tab and click on button

Question

1 answers

solution1
0 2016-11-28 05:42:30

Chrome extension: Open new tab and click on button

Question

1 answers

solution1 0 2016-11-28 05:42:30

solution1
0 2016-11-28 05:42:30