AGDNS-4262

Author: IldarKamalov

client_v2/src/__locales/en.json

@@ -432,6 +432,7 @@
   "friday": "Friday",
   "gateway_or_subnet_invalid": "Invalid subnet mask",
   "general_statistics": "General statistics",
+  "go_back": "Go back",
   "greater_range_start_error": "The end of the range must be greater than the start",
   "home_dns_addresses": "AdGuard Home DNS addresses",
   "home_dns_addresses_desc": "The AdGuard Home DNS server listens on the following interfaces/ports:",
@@ -773,6 +774,36 @@
   "tls_certificate_expiring": "Your TLS certificate is about to expire",
   "tls_key_path_label": "Full path to the private key file",
   "tls_key_path_option": "Enter the full path to the private key file",
+  "tls_setup_backend_error_title": "Could not enable encrypted DNS",
+  "tls_setup_cert_description": "For DNS encryption, you need a valid TLS certificate chain for your domain — get a free one from letsencrypt.org or buy from a trusted CA. After adding the certificate and key, you'll configure the encrypted DNS server settings",
+  "tls_setup_cert_paste_label": "Paste the certificate contents",
+  "tls_setup_cert_path_option": "Path to file on the server",
+  "tls_setup_cert_path_option_desc": "If the certificate is already on the device running AdGuard Home. It will stay on disk and update automatically when renewed.",
+  "tls_setup_cert_text_option": "Certificate as text",
+  "tls_setup_cert_text_option_desc": "If the certificate is on your computer. It will be saved to the AdGuard Home configuration file",
+  "tls_setup_cert_title": "Add certificate",
+  "tls_setup_config_title": "Enable encrypted DNS",
+  "tls_setup_dot_port_label": "DNS-over-TLS port",
+  "tls_setup_doq_port_label": "DNS-over-QUIC port",
+  "tls_setup_error_duplicate_port": "Port %port% is used by multiple DNS protocols. It must be unique",
+  "tls_setup_error_ed25519_key": "ED25519 keys are not supported by browsers",
+  "tls_setup_error_empty_cert": "Certificate is empty",
+  "tls_setup_error_no_key": "No valid private keys were found",
+  "tls_setup_error_parse_cert": "Unable to parse the certificate",
+  "tls_setup_error_parse_key": "Unable to parse the private key",
+  "tls_setup_error_port_busy": "Port %port% is not available for %protocol%",
+  "tls_setup_hint_go_back": "Go back to a previous step to fix the issue",
+  "tls_setup_https_port_label": "HTTPS port",
+  "tls_setup_key_description": "The private key must match the certificate from the previous step. Choose how to add it depending on where the key is stored",
+  "tls_setup_key_paste_label": "Paste the key contents",
+  "tls_setup_key_path_option": "Path to file on the server",
+  "tls_setup_key_path_option_desc": "If the key is already on the device running AdGuard Home, it will stay on disk",
+  "tls_setup_key_text_option": "Private key as text",
+  "tls_setup_key_text_option_desc": "If the key is on your computer, paste it or upload the file — it will be saved to the AdGuard Home configuration file",
+  "tls_setup_key_title": "Add private key",
+  "tls_setup_server_name_label": "Server name",
+  "tls_setup_warning_cert_untrusted": "The certificate chain cannot be verified: it may be self-signed, expired, or for a different hostname",
+  "tls_setup_warning_no_ip": "The certificate has no IP addresses. DNS-over-TLS won't be advertised via DDR",
   "top_blocked_domains": "Top blocked domains",
   "top_clients": "Top clients",
   "top_upstreams": "Top upstreams",

client_v2/src/__tests__/components/encryption-wiring.test.tsx

@@ -0,0 +1,106 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { render, screen, waitFor } from '@solidjs/testing-library';
+import userEvent from '@testing-library/user-event';
+
+const mocks = vi.hoisted(() => ({
+    tlsStatus: vi.fn(),
+    tlsConfigure: vi.fn(),
+    tlsValidate: vi.fn(),
+    addErrorToast: vi.fn(),
+    addSuccessToast: vi.fn(),
+    redirectToCurrentProtocol: vi.fn(),
+}));
+
+vi.mock('panel/api/generated', () => ({
+    tlsStatus: mocks.tlsStatus,
+    tlsConfigure: mocks.tlsConfigure,
+    tlsValidate: mocks.tlsValidate,
+}));
+vi.mock('panel/stores/toasts', () => ({
+    addErrorToast: mocks.addErrorToast,
+    addSuccessToast: mocks.addSuccessToast,
+}));
+vi.mock('panel/stores/dashboard', () => ({
+    getDnsStatus: vi.fn(),
+    dashboardState: { httpPort: 80 },
+}));
+vi.mock('panel/helpers/helpers', () => ({
+    redirectToCurrentProtocol: mocks.redirectToCurrentProtocol,
+}));
+
+import { Encryption } from 'panel/components/Encryption/Encryption';
+
+const statusNoCert = {
+    enabled: false,
+    serve_plain_dns: true,
+    force_https: false,
+    server_name: '',
+    port_https: 0,
+    port_dns_over_tls: 0,
+    port_dns_over_quic: 0,
+    certificate_chain: '',
+    certificate_path: '',
+    private_key: '',
+    private_key_path: '',
+    private_key_saved: false,
+    warning_validation: '',
+};
+
+describe('Encryption — TLS setup wizard wiring', () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+        mocks.tlsStatus.mockResolvedValue(statusNoCert);
+    });
+
+    it('opens the wizard via the plus button when no certificate is configured', async () => {
+        const user = userEvent.setup();
+        render(() => <Encryption />);
+
+        await waitFor(() => {
+            expect(screen.getByText('Add TLS certificate')).toBeInTheDocument();
+        });
+
+        await user.click(screen.getByText('Add TLS certificate'));
+
+        expect(await screen.findByText('Add certificate')).toBeInTheDocument();
+        expect(screen.getByRole('progressbar')).toHaveAttribute('aria-valuenow', '1');
+    });
+
+    it('opens the wizard when the Encrypted DNS switch is turned on without a cert', async () => {
+        const user = userEvent.setup();
+        render(() => <Encryption />);
+
+        await waitFor(() => {
+            expect(screen.getByText('Encrypted DNS')).toBeInTheDocument();
+        });
+
+        const switchInput = document.getElementById('encrypted_dns') as HTMLInputElement;
+        expect(switchInput).not.toBeNull();
+        await user.click(switchInput);
+
+        expect(await screen.findByText('Add certificate')).toBeInTheDocument();
+    });
+
+    it('cancelling the wizard leaves the switch off', async () => {
+        const user = userEvent.setup();
+        render(() => <Encryption />);
+
+        await waitFor(() => {
+            expect(screen.getByText('Encrypted DNS')).toBeInTheDocument();
+        });
+
+        const switchInput = document.getElementById('encrypted_dns') as HTMLInputElement;
+        await user.click(switchInput);
+
+        expect(await screen.findByText('Add certificate')).toBeInTheDocument();
+
+        // Cancel (secondary button in the wizard footer).
+        const cancelButton = screen.getByRole('button', { name: 'Cancel' });
+        await user.click(cancelButton);
+
+        await waitFor(() => {
+            expect(switchInput.checked).toBe(false);
+        });
+        expect(mocks.tlsConfigure).not.toHaveBeenCalled();
+    });
+});