networking: Add support for WireGuard #19024

subhoghoshX · 2023-06-26T16:09:47Z

TODO:

Make address field in add/edit dialog the same as in the IPv4 settings dialog. detail: network: distinguish create and edit dialogs #19209
Test and fix deletion, deactivate first detail
Test invalid endpoint without port, improve error message detail
Update dialog to design

Follow-ups:

Disable DHCP mode for wireguard interfaces: Disable unsupported IPv4/IPv6 methods for wireguard #19337
Support setting up the server side: configure allowed IPs, but no peers: test: configure wireguard server side using the browser object #19489

Networking: Add support for WireGuard

The Networking page can now create and edit WireGuard VPN connections.

Many thanks to Subho Ghosh for adding this feature as part of his Google Summer of Code project! and thanks to Gil Obradors for his initial work.

test/verify/check-vpn

subhoghoshX · 2023-06-27T05:50:25Z

Oops, I should've written the new tests before pushing. The bot is not pleased at all.

subhoghoshX · 2023-06-27T16:13:47Z

Rewrote tests using the browser object and some cleanup.

martinpitt

Some initial early feedback. This is going well, thanks!

pkg/networkmanager/dialogs-common.jsx

pkg/networkmanager/network-main.jsx

pkg/networkmanager/utils.js

pkg/networkmanager/wireguard.jsx

test/verify/check-vpn

subhoghoshX · 2023-07-04T11:12:09Z

Rebased. Renamed the test file and class to something proper. And introduced install_dialog if the wg binary is not found!

martinpitt

Thanks!

pkg/networkmanager/dialogs-common.jsx

pkg/networkmanager/manifest.json

pkg/networkmanager/dialogs-common.jsx

test/verify/check-networkmanager-wireguard

garrett · 2023-07-05T08:58:37Z

This is looking great! I have some feedback about Martin's feedback and my own feedback based on the screenshot.

Missing space between input line and "Generate private key"

These elements are connected. It should probably be an input group with a text input and a button. (See design docs.) The button label should say "Generate"; the form element already has a label of "Private key".

Would be nice to make "Private key" a type=password, with a "reveal" button (like here)

No. This is not a password. It also needs to also be copyable. Do not make it a password entry and don't add a reveal button.

Additional feedback:

Public and private keys should be in a monospace font.
Numbers should be using tabular numbers or monospace. This isn't. (If they're just number entries, then monospace is fine.) (pitti: unclear what this means; it seems fine to me, there are no tables here and we still apply tabular numbers globally)
Listen port should be a number input that's restricted width (I think it does this by default). It should also have min/max set up; I haven't looked to see if it does.
Addresses should have input helperText (the form input helper text, not the helper text component) that explains which formats are accepted. (IPv4, IPv6, range of addresses, singular address, etc. — whatever is supported, we should show).
Is the addresses field space separated or comma separated? Or can it accept both? The helper text should probably state what is expected, and we should probably handle both space and/or comma separated, really.
Addresses field could also have examples as placeholder text, but these would have to follow PatternFly guidelines and be in addition to the helperText.
Is this a create dialog? Then it should say "Create VPN", not "Save". In edit mode, it should say "Save", however. -- pitti: that is shared between all existing dialogs, they have the same problem → separate PR
The title "WireGuard settings" should either be "Create WireGuard VPN" or "Edit WireGuard VPN", based on the mode of the modal. -- pitti: Likewise, shared dialog → separate PR

martinpitt

A few more small issues, but the bulk of TODOs are still in the previous rounds of open threads. Thanks!

pkg/networkmanager/interfaces.js

pkg/networkmanager/wireguard.jsx

test/run

martinpitt

Thanks! I resolved all previous review threads, and for easier tracking I also moved all of mine and most of Garrett's UI review into threads. I'm happy to help with the two last generic "create vs. edit" issues in a separate PR, unless you want to do it yourself.

test/verify/check-networkmanager-wireguard

pkg/networkmanager/wireguard.jsx

test/verify/check-networkmanager-wireguard

pkg/networkmanager/network-main.jsx

test/verify/check-networkmanager-wireguard

pkg/networkmanager/wireguard.jsx

test/verify/check-networkmanager-wireguard

garrett · 2023-08-23T07:07:43Z

(Yesterday evening and this morning, I've been working on mockups and sharing in Matrix; they're not here yet. I'll upload soon.)

garrett · 2023-08-24T15:28:03Z

Apologies for not uploading these sooner. Here are (what I think) are the current versions of the mockups in various states:

Default:

Popover help for the peers (some text kinda like this; subject to change; feel free to work on it further):

Paste (without private key):

Paste (with the key):

Edit:

martinpitt · 2023-09-13T06:09:54Z

@garrett 's designs from above are implemented correctly (with the minor changes discussed afterwards). The ? icon position got fixed. I also extensively tested valiation/error messages with wrong values, pasting key, etc. This works really well now! 👏

This needs at least a pixel ref update, and we should also introduce a new pixel test for the dialog, as it has some non-trivial layout and e.g. the question mark position. I'll also go through the code once more.

martinpitt

Great! Just some trivialities, I'll deal with them together with the pixel test updates.

pkg/networkmanager/wireguard.jsx

test/verify/check-networkmanager-wireguard

martinpitt

I updated the pixel test, added a new one for the dialog, fixed the two trivial issues above, and updated the release note to current screenshots. Let's land! once green! 🚀

@subhoghoshX congratulations! Can you please look at the two follow-ups in the description?

cockpituous · 2023-09-13T08:54:28Z

pkg/networkmanager/dialogs-common.jsx

+                model,
+                modify,
+                {
+                    fail_text: cockpit.format(_("Creating this $0 will break the connection to the server, and will make the administration UI unavailable."), type == 'vlan' ? 'VLAN' : type),


This added line is not executed by any test. Details

cockpituous · 2023-09-13T08:54:29Z

pkg/networkmanager/dialogs-common.jsx

+                    rollback_on_failure: type != 'vlan',
+                });
+        } catch (e) {
+            setDialogError(typeof e === 'string' ? e : e.message);


This added line is not executed by any test. Details

martinpitt · 2023-09-13T09:36:46Z

I have the remaining test failures on my radar, they are unrelated.

github-advanced-security bot found potential problems Jun 26, 2023

View reviewed changes

test/verify/check-vpn Fixed Show fixed Hide fixed

martinpitt marked this pull request as draft June 27, 2023 03:25

martinpitt mentioned this pull request Jun 27, 2023

networking: VPN support #16992

Open

subhoghoshX force-pushed the wireguard branch from 14729dc to be63190 Compare June 27, 2023 16:07

martinpitt requested changes Jun 30, 2023

View reviewed changes

subhoghoshX force-pushed the wireguard branch from be63190 to 55dbfd0 Compare July 3, 2023 11:03

This comment was marked as outdated.

Sign in to view

subhoghoshX force-pushed the wireguard branch from 55dbfd0 to 726c067 Compare July 3, 2023 13:56

github-advanced-security bot found potential problems Jul 3, 2023

View reviewed changes

test/verify/check-vpn Fixed Show fixed Hide fixed

test/verify/check-vpn Fixed Show fixed Hide fixed

subhoghoshX force-pushed the wireguard branch 2 times, most recently from 301cee2 to 1ea465d Compare July 4, 2023 11:07

This comment was marked as duplicate.

Sign in to view

martinpitt requested changes Jul 5, 2023

View reviewed changes

subhoghoshX force-pushed the wireguard branch from 1ea465d to 3bc1138 Compare July 11, 2023 11:40

martinpitt reviewed Jul 17, 2023

View reviewed changes

subhoghoshX force-pushed the wireguard branch from 3bc1138 to 28f1f11 Compare July 18, 2023 09:39

This comment was marked as resolved.

Sign in to view

subhoghoshX force-pushed the wireguard branch 2 times, most recently from f2155e7 to 332f4bf Compare July 19, 2023 10:19

This comment was marked as resolved.

Sign in to view

subhoghoshX force-pushed the wireguard branch from 332f4bf to 4ed0b4a Compare July 19, 2023 16:05

martinpitt requested changes Jul 20, 2023

View reviewed changes

subhoghoshX force-pushed the wireguard branch 3 times, most recently from aa0bc6c to a02131c Compare July 24, 2023 13:41

github-advanced-security bot found potential problems Jul 24, 2023

View reviewed changes

test/verify/check-networkmanager-wireguard Fixed Show fixed Hide fixed

This comment was marked as outdated.

Sign in to view

subhoghoshX dismissed martinpitt’s stale review via abe933d September 4, 2023 16:37

subhoghoshX force-pushed the wireguard branch 5 times, most recently from 69e0670 to 3f01ea5 Compare September 5, 2023 10:01

This comment was marked as resolved.

Sign in to view

subhoghoshX force-pushed the wireguard branch 2 times, most recently from ba5df71 to b7a0e7a Compare September 5, 2023 12:00

This comment was marked as resolved.

Sign in to view

subhoghoshX force-pushed the wireguard branch 2 times, most recently from 59c1e9a to c20234c Compare September 5, 2023 14:31

This comment was marked as resolved.

Sign in to view

subhoghoshX force-pushed the wireguard branch 2 times, most recently from 3991a87 to e49ec19 Compare September 12, 2023 13:18

martinpitt requested changes Sep 13, 2023

View reviewed changes

pkg/networkmanager/wireguard.jsx Outdated Show resolved Hide resolved

test/verify/check-networkmanager-wireguard Outdated Show resolved Hide resolved

networking: Add support for WireGuard

1f53987

martinpitt force-pushed the wireguard branch from e49ec19 to 1f53987 Compare September 13, 2023 07:46

martinpitt approved these changes Sep 13, 2023

View reviewed changes

cockpituous reviewed Sep 13, 2023

View reviewed changes

martinpitt merged commit 8409619 into cockpit-project:main Sep 13, 2023
91 of 93 checks passed

subhoghoshX mentioned this pull request Sep 15, 2023

Disable unsupported IPv4/IPv6 methods for wireguard #19337

Merged

allisonkarlitskaya removed the release-note label Oct 5, 2023

subhoghoshX mentioned this pull request Oct 16, 2023

test: configure wireguard server side using the browser object #19489

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

networking: Add support for WireGuard #19024

networking: Add support for WireGuard #19024

subhoghoshX commented Jun 26, 2023 •

edited

Loading

subhoghoshX commented Jun 27, 2023

subhoghoshX commented Jun 27, 2023

martinpitt left a comment

This comment was marked as outdated.

subhoghoshX commented Jul 4, 2023

This comment was marked as duplicate.

martinpitt left a comment

garrett commented Jul 5, 2023 •

edited by martinpitt

Loading

martinpitt left a comment

This comment was marked as resolved.

This comment was marked as resolved.

martinpitt left a comment

This comment was marked as outdated.

garrett commented Aug 23, 2023

garrett commented Aug 24, 2023

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

martinpitt commented Sep 13, 2023

martinpitt left a comment

martinpitt left a comment

cockpituous Sep 13, 2023

cockpituous Sep 13, 2023

martinpitt commented Sep 13, 2023

networking: Add support for WireGuard #19024

networking: Add support for WireGuard #19024

Conversation

subhoghoshX commented Jun 26, 2023 • edited Loading

Networking: Add support for WireGuard

subhoghoshX commented Jun 27, 2023

subhoghoshX commented Jun 27, 2023

martinpitt left a comment

Choose a reason for hiding this comment

This comment was marked as outdated.

subhoghoshX commented Jul 4, 2023

This comment was marked as duplicate.

martinpitt left a comment

Choose a reason for hiding this comment

garrett commented Jul 5, 2023 • edited by martinpitt Loading

martinpitt left a comment

Choose a reason for hiding this comment

This comment was marked as resolved.

This comment was marked as resolved.

martinpitt left a comment

Choose a reason for hiding this comment

This comment was marked as outdated.

garrett commented Aug 23, 2023

garrett commented Aug 24, 2023

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

martinpitt commented Sep 13, 2023

martinpitt left a comment

Choose a reason for hiding this comment

martinpitt left a comment

Choose a reason for hiding this comment

cockpituous Sep 13, 2023

Choose a reason for hiding this comment

cockpituous Sep 13, 2023

Choose a reason for hiding this comment

martinpitt commented Sep 13, 2023

subhoghoshX commented Jun 26, 2023 •

edited

Loading

garrett commented Jul 5, 2023 •

edited by martinpitt

Loading