Persist chrome extension script after page reloads

action.js 

    document.getElementById("fillForm").addEventListener("click", function () {
      chrome.tabs.executeScript({
        file: "injector.js",
      });
    });

injector.js

    i = 0;

data = [
  {
    tag: 234234,
    serial: "2342342",
  },
  {
    tag: 623476,
    serial: "HfgsdgfH2",
  },
  {
    tag: 6324398,
    serial: "3sdfgsNH2",
  },
];

var obj = data[i];

var myIframe = document.getElementsByName("RadWindowInventory")[0];
var iFrameDocument = myIframe.contentDocument;
iFrameDocument.getElementById("inputOfTag").value = obj.tag;
iFrameDocument.getElementById("inputOfSerial").value = obj.serial;

i++;


index.html

    <!DOCTYPE html>
    <html>
      <head>
        <style>
          html,
          body {
            height: 200px;
            width: 400px;
          }
        </style>
      </head>
      <body>
        <h1>Chrome extension demo</h1>
    
        <button id="fillForm">Fill form</button>
        <script src="action.js"></script>
      </body>
    </html>

   
`

manifest.json


        {
      "manifest_version": 2,
      "name": "Demo chrome extension",
      "description": "A demonstration of a bespoke chrome extension being used to populate form fields",
      "homepage_url": "http://www.mwtestconsultancy.co.uk",
      "version": "1.0",
      "browser_action": {
        "default_title": "Click here!",
        "default_popup": "index.html"
      },
      "permissions": ["<all_urls>"]
    }

Is it possible to run injector.js to run injector.js every time the page loads? IE clicking the button would increment I and then inject the next object. Currently, if the page reloads the script restarts. If I click the button twice to load the next object I get an error

Uncaught TypeError: Cannot read property 'addEventListener' of null Uncaught TypeError: Cannot read property 'contentDocument' of undefined at injector.js:125