<h3 dir="auto">Preflight Checklist</h3>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have read the <a href="https://github.com/electron/electron/blob/master/CONTRIBUTING.md">Contributing Guidelines</a> for this project.</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I agree to follow the <a href="https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md">Code of Conduct</a> that this project adheres to.</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have searched the issue tracker for an issue that matches the one I want to file, without success.</li>
</ul>
<h3 dir="auto">Issue Details</h3>
<ul dir="auto">
<li><strong>Electron Version:</strong> 11.0.3</li>
<li><strong>Operating System:</strong> MacOS catalina 10.15.7</li>
<li><strong>Last Known Working Electron version:</strong> 10.1.3</li>
</ul>
<p dir="auto">The TouchBarPopover item does not work anymore, creating a popover and clicking on it shows an empty touch bar.</p>
<h3 dir="auto">Expected Behavior</h3>
<p dir="auto">The TouchBarPopover defined TouchBar should be displayed.</p>
<h3 dir="auto">Actual Behavior</h3>
<p dir="auto">The TouchBarPopover is not showing the TouchBar specified in his items field.</p>
<h3 dir="auto">To Reproduce</h3>
<p dir="auto">Here is a minimal example, this is the main process script, the test does not need renderer code at all.</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const { app, BrowserWindow,TouchBar } = require('electron');
const { TouchBarButton, TouchBarPopover } = TouchBar;

const touchBar = new TouchBar({
    items: [
        new TouchBarPopover({
            label: &quot;2D&quot;,
            items: new TouchBar({
                items: [
                    new TouchBarButton({ label:&quot;Disc&quot;, click: ()=&gt; console.log(&quot;new&quot;, &quot;Disc&quot;)}),
                    new TouchBarButton({ label:&quot;Beam&quot;, click: ()=&gt; console.log(&quot;new&quot;, &quot;Beam&quot;)}),
                ]
            })
        })
    ]
});

function createWindow () {
  const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true } });
  win.setTouchBar(touchBar);
}

app.whenReady().then(createWindow);"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-kos">{</span> app<span class="pl-kos">,</span> BrowserWindow<span class="pl-kos">,</span>TouchBar <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'electron'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-k">const</span> <span class="pl-kos">{</span> TouchBarButton<span class="pl-kos">,</span> TouchBarPopover <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-v">TouchBar</span><span class="pl-kos">;</span>

<span class="pl-k">const</span> <span class="pl-s1">touchBar</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> <span class="pl-v">TouchBar</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
    <span class="pl-c1">items</span>: <span class="pl-kos">[</span>
        <span class="pl-k">new</span> <span class="pl-v">TouchBarPopover</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
            <span class="pl-c1">label</span>: <span class="pl-s">"2D"</span><span class="pl-kos">,</span>
            <span class="pl-c1">items</span>: <span class="pl-k">new</span> <span class="pl-v">TouchBar</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
                <span class="pl-c1">items</span>: <span class="pl-kos">[</span>
                    <span class="pl-k">new</span> <span class="pl-v">TouchBarButton</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">label</span>:<span class="pl-s">"Disc"</span><span class="pl-kos">,</span> <span class="pl-en">click</span>: <span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-c1">=&gt;</span> <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">"new"</span><span class="pl-kos">,</span> <span class="pl-s">"Disc"</span><span class="pl-kos">)</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
                    <span class="pl-k">new</span> <span class="pl-v">TouchBarButton</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">label</span>:<span class="pl-s">"Beam"</span><span class="pl-kos">,</span> <span class="pl-en">click</span>: <span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-c1">=&gt;</span> <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">"new"</span><span class="pl-kos">,</span> <span class="pl-s">"Beam"</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">}</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-k">function</span> <span class="pl-en">createWindow</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">const</span> <span class="pl-s1">win</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> <span class="pl-v">BrowserWindow</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">width</span>: <span class="pl-c1">800</span><span class="pl-kos">,</span> <span class="pl-c1">height</span>: <span class="pl-c1">600</span><span class="pl-kos">,</span> <span class="pl-c1">webPreferences</span>: <span class="pl-kos">{</span> <span class="pl-c1">nodeIntegration</span>: <span class="pl-c1">true</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-s1">win</span><span class="pl-kos">.</span><span class="pl-en">setTouchBar</span><span class="pl-kos">(</span><span class="pl-s1">touchBar</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span>

<span class="pl-s1">app</span><span class="pl-kos">.</span><span class="pl-en">whenReady</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">then</span><span class="pl-kos">(</span><span class="pl-s1">createWindow</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">... it needs a mac to be tested!</p>
<h3 dir="auto">Screenshots</h3>
<p dir="auto">Wanted behaviour (as with electron 10.1.6):</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/1829939/100750275-14d61080-33e6-11eb-968f-7dc9ccca6c20.jpg"><img src="https://user-images.githubusercontent.com/1829939/100750275-14d61080-33e6-11eb-968f-7dc9ccca6c20.jpg" alt="IMG_3739" style="max-width: 100%;"></a><br>
Actual behaviour (electron 11.0.2 and electron 11.0.3):<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/1829939/100750318-24555980-33e6-11eb-87a7-bb6e9abadf9d.jpg"><img src="https://user-images.githubusercontent.com/1829939/100750318-24555980-33e6-11eb-87a7-bb6e9abadf9d.jpg" alt="IMG_3738" style="max-width: 100%;"></a></p>
<h3 dir="auto">Additional Information</h3>
<h3 dir="auto">Preflight Checklist</h3>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have read the <a href="https://github.com/electron/electron/blob/master/CONTRIBUTING.md">Contributing Guidelines</a> for this project.</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I agree to follow the <a href="https://github.com/electron/electron/blob/master/CODE_OF_CONDUCT.md">Code of Conduct</a> that this project adheres to.</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have searched the issue tracker for an issue that matches the one I want to file, without success.</li>
</ul>
<h3 dir="auto">Issue Details</h3>
<ul dir="auto">
<li><strong>Electron Version:</strong>
<ul dir="auto">
<li>11.0.2</li>
</ul>
</li>
<li><strong>Operating System:</strong>
<ul dir="auto">
<li>macOS 10.15.5 (19F101)</li>
</ul>
</li>
<li><strong>Last Known Working Electron version:</strong>
<ul dir="auto">
<li>10.1.6</li>
</ul>
</li>
</ul>
<h3 dir="auto">Expected Behavior</h3>
<p dir="auto">Items inside a TouchBarGroup or TouchBarPopover should be rendered.</p>
<h3 dir="auto">Actual Behavior</h3>
<p dir="auto">Items inside a TouchBarGroup or TouchBarPopover don't show up.</p>
<h3 dir="auto">To Reproduce</h3>
<p dir="auto"><a href="https://gist.github.com/390d885b1cf4209a81583b0ee1e0d9aa">https://gist.github.com/390d885b1cf4209a81583b0ee1e0d9aa</a></p>