<p dir="auto">When a <code class="notranslate">&lt;webview&gt;</code> tag points to a page which tries to load another <code class="notranslate">&lt;webview&gt;</code> tag, the inner webview fails to load. Example below:</p>
<p dir="auto">In main.js, we load a page webview_outer:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="mainWindow.loadURL('file://' + __dirname + '/webview_outer.html');"><pre class="notranslate"><span class="pl-s1">mainWindow</span><span class="pl-kos">.</span><span class="pl-en">loadURL</span><span class="pl-kos">(</span><span class="pl-s">'file://'</span> <span class="pl-c1">+</span> <span class="pl-s1">__dirname</span> <span class="pl-c1">+</span> <span class="pl-s">'/webview_outer.html'</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">In webview_outer.html, we load another page webview_inner:</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;html&gt;
&lt;body onload='onload()'&gt;
  &lt;webview id=&quot;webview_outer&quot;&gt;&lt;/webview&gt;
  &lt;script&gt;
    onload = function() {
      // This loads a page with a webview inside
      var webview = document.querySelector('#webview_outer');
      webview.src = 'file://' + __dirname + '/webview_inner.html';

      webview.addEventListener('dom-ready', function() {
        webview.openDevTools();
      });
    }
  &lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">body</span> <span class="pl-c1">onload</span>='<span class="pl-s">onload()</span>'<span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">webview</span> <span class="pl-c1">id</span>="<span class="pl-s">webview_outer</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">webview</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span>
    <span class="pl-en">onload</span> <span class="pl-c1">=</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
      <span class="pl-c">// This loads a page with a webview inside</span>
      <span class="pl-k">var</span> <span class="pl-s1">webview</span> <span class="pl-c1">=</span> <span class="pl-smi">document</span><span class="pl-kos">.</span><span class="pl-en">querySelector</span><span class="pl-kos">(</span><span class="pl-s">'#webview_outer'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-s1">webview</span><span class="pl-kos">.</span><span class="pl-c1">src</span> <span class="pl-c1">=</span> <span class="pl-s">'file://'</span> <span class="pl-c1">+</span> <span class="pl-s1">__dirname</span> <span class="pl-c1">+</span> <span class="pl-s">'/webview_inner.html'</span><span class="pl-kos">;</span>

      <span class="pl-s1">webview</span><span class="pl-kos">.</span><span class="pl-en">addEventListener</span><span class="pl-kos">(</span><span class="pl-s">'dom-ready'</span><span class="pl-kos">,</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
        <span class="pl-s1">webview</span><span class="pl-kos">.</span><span class="pl-en">openDevTools</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">In webview_inner.html, we attempt to load a final web page (in this example the electron docs):</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;html&gt;
&lt;body onload='onload()'&gt;
  &lt;webview id=&quot;webview_inner&quot;&gt;&lt;/webview&gt;
  &lt;script&gt;
    onload = function() {
      // This webview never loads
      var webview = document.querySelector('#webview_inner');
      webview.src = 'http://electron.atom.io/docs/v0.36.0/';

      webview.addEventListener('dom-ready', function() {
        webview.openDevTools();
      });
    }
  &lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">body</span> <span class="pl-c1">onload</span>='<span class="pl-s">onload()</span>'<span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">webview</span> <span class="pl-c1">id</span>="<span class="pl-s">webview_inner</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">webview</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span>
    <span class="pl-en">onload</span> <span class="pl-c1">=</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
      <span class="pl-c">// This webview never loads</span>
      <span class="pl-k">var</span> <span class="pl-s1">webview</span> <span class="pl-c1">=</span> <span class="pl-smi">document</span><span class="pl-kos">.</span><span class="pl-en">querySelector</span><span class="pl-kos">(</span><span class="pl-s">'#webview_inner'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-s1">webview</span><span class="pl-kos">.</span><span class="pl-c1">src</span> <span class="pl-c1">=</span> <span class="pl-s">'http://electron.atom.io/docs/v0.36.0/'</span><span class="pl-kos">;</span>

      <span class="pl-s1">webview</span><span class="pl-kos">.</span><span class="pl-en">addEventListener</span><span class="pl-kos">(</span><span class="pl-s">'dom-ready'</span><span class="pl-kos">,</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
        <span class="pl-s1">webview</span><span class="pl-kos">.</span><span class="pl-en">openDevTools</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">The inner webview never loads. Is loading a <code class="notranslate">&lt;webview&gt;</code> inside a <code class="notranslate">&lt;webview&gt;</code> not supported by electron's architecture?</p>
<p dir="auto">(OS X El Capitan 10.11.2, Electron 0.36.2 [using electron-prebuilt])</p>
<p dir="auto">index.html</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;webview src=&quot;file:///embedded.html&quot;&gt;&lt;/webview&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">webview</span> <span class="pl-c1">src</span>="<span class="pl-s">file:///embedded.html</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">webview</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">embedded.html</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;h1&gt;github&lt;/h1&gt;
&lt;webview src=&quot;http://github.com&quot;&gt;&lt;/webview&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>github<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">webview</span> <span class="pl-c1">src</span>="<span class="pl-s">http://github.com</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">webview</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">Would it be possible to have <code class="notranslate">index.html</code> render the header and webview of <code class="notranslate">embedded.html</code>?  I don't seem to currently be able to do this.</p>