title: Cant access iframe object from the loaded page
body: <p>I have an iframe created dynamically like</p>
  <pre><code>var iframe = document.createElement('iframe');
  iframe.src = chrome.runtime.getURL('frame.html');
  document.body.appendChild(iframe);
  </code></pre>
  <p>and now i want to close the iframe from a button click inside the loaded webpage.So for that i added a button in my loaded iframe html</p>
  <pre><code>&lt;img class=&quot;icon-close&quot; id=&quot;btn-close&quot; src=&quot;icons/close.png&quot;&gt;
  </code></pre>
  <p>and js code for clicking event looks like</p>
  <pre><code>btn_close.addEventListener('click', function() {
          var frame=parent.document.getElementById(window.name);
          console.log(frame);
  });
  </code></pre>
  <p>But when i run this, i am getting an error like</p>
  <pre><code>Uncaught DOMException: Blocked a frame with origin from accessing a cross-origin frame
  </code></pre>
  <p>How can i solve this issue.Thanks in advance</p>