<p dir="auto"><strong>Preflight Checklist</strong></p>
<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 a feature request that matches the one I want to file, without success.</li>
</ul>
<p dir="auto"><strong>Problem Description</strong></p>
<p dir="auto">In Wayland clients usually render their own decorations, they don't get SSD anymore (although there seems to be a protocol for SSD negotiation that Plasma and some compositors based on wlroots implement). The Wayland build is not very useful until Electron app windows get a proper headerbar. The headerbar can be a stock headerbar similar to old-school SSD or can be customized by the app (for example, by setting its color/theme in accordance with the app contents).</p>
<p dir="auto"><strong>Proposed Solution</strong></p>
<p dir="auto">Use GTK CSD support, which is also well-integrated in Qt-based environments (mainly Plasma):</p>
<p dir="auto"><a href="https://developer.gnome.org/gtk3/stable/GtkHeaderBar.html" rel="nofollow">https://developer.gnome.org/gtk3/stable/GtkHeaderBar.html</a>:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="void gtk_header_bar_set_show_close_button (GtkHeaderBar *bar, gboolean setting);

Sets whether this header bar shows the standard window decorations, including close, maximize, and minimize."><pre class="notranslate"><code class="notranslate">void gtk_header_bar_set_show_close_button (GtkHeaderBar *bar, gboolean setting);

Sets whether this header bar shows the standard window decorations, including close, maximize, and minimize.
</code></pre></div>
<p dir="auto"><a href="https://developer.gnome.org/gtk3/stable/GtkSettings.html#GtkSettings--gtk-decoration-layout" rel="nofollow">https://developer.gnome.org/gtk3/stable/GtkSettings.html#GtkSettings--gtk-decoration-layout</a>:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="“gtk-decoration-layout”    char *

This setting determines which buttons should be put in the titlebar of client-side decorated windows, and whether they should be placed at the left of right."><pre class="notranslate"><code class="notranslate">“gtk-decoration-layout”    char *

This setting determines which buttons should be put in the titlebar of client-side decorated windows, and whether they should be placed at the left of right.
</code></pre></div>
<p dir="auto"><strong>Alternatives Considered</strong></p>
<p dir="auto">It doesn't seem to exist much more alternatives. Maybe Qt has a native headerbar implementation, but it won't properly work inside a GTK-based environment like GNOME, while it works the other way around. See <a href="https://pointieststick.com/2019/11/30/this-week-in-kde-gtk-csd-support-and-more" rel="nofollow">https://pointieststick.com/2019/11/30/this-week-in-kde-gtk-csd-support-and-more</a></p>
<p dir="auto">Maybe xdg-decoration as suggested in some comments below. But I ignore everything about it and SSD doesn't seem to me the best alternative for Electron apps that tend to be more app-centric than platform-centric by its very nature and so, at least in major platforms, usually customize headerbars.</p>
<p dir="auto"><strong>Additional Information</strong></p>
<p dir="auto">More details in discussion starting from <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="268514984" data-permission-text="Title is private" data-url="https://github.com/electron/electron/issues/10915" data-hovercard-type="issue" data-hovercard-url="/electron/electron/issues/10915/hovercard?comment_id=767997150&amp;comment_type=issue_comment" href="https://github.com/electron/electron/issues/10915#issuecomment-767997150">#10915 (comment)</a></p>
<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>
 9.2.1
</li>
</ul>
</li>
<li><strong>Operating System:</strong>
<ul dir="auto">
<li>
 macOS Catalina
</li>
</ul>
</li>
<li><strong>Last Known Working Electron version:</strong>
<ul dir="auto">
<li>

</li>
</ul>
</li>
</ul>
<h3 dir="auto">Expected Behavior</h3>
<p dir="auto">When <code class="notranslate">ipcMain.handle()</code> return a rejected promise, no message should be printed on the main console and the error message in <code class="notranslate">ipcRenderer.invoke().reject()</code> should contain the exact error message.</p>
<h3 dir="auto">Actual Behavior</h3>
<p dir="auto">When <code class="notranslate">ipcMain.handle()</code> return a rejected promise, a message like this is printed in the main console:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Error occurred in handler for '&lt;channel&gt;': Error: &lt;rejected error message&gt;

-&gt; the attempted result here is that no message should be displayed in main console !"><pre class="notranslate"><code class="notranslate">Error occurred in handler for '&lt;channel&gt;': Error: &lt;rejected error message&gt;

-&gt; the attempted result here is that no message should be displayed in main console !
</code></pre></div>
<p dir="auto">And the <code class="notranslate">ipcRenderer.invoke().reject()</code> error message is:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Error invoking remote method '&lt;channel&gt;': Error: my-error

-&gt; the attempted error message here is only &quot;Error: my-error&quot;"><pre class="notranslate"><code class="notranslate">Error invoking remote method '&lt;channel&gt;': Error: my-error

-&gt; the attempted error message here is only "Error: my-error"
</code></pre></div>
<h3 dir="auto">To Reproduce</h3>
<p dir="auto">main.js</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="ipcMain.handle('channel', (event, options) =&gt; {
  return Promise.reject(new Error('my-error'))
})"><pre class="notranslate"><code class="notranslate">ipcMain.handle('channel', (event, options) =&gt; {
  return Promise.reject(new Error('my-error'))
})
</code></pre></div>
<p dir="auto">renderer.js</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="ipcRenderer.invoke('channel').then(result =&gt; {
  console.log(result)
}).catch(err =&gt; {
  console.log(err)
})"><pre class="notranslate"><code class="notranslate">ipcRenderer.invoke('channel').then(result =&gt; {
  console.log(result)
}).catch(err =&gt; {
  console.log(err)
})
</code></pre></div>