From 629c84d0bd1263b535a47b14621bcc26bb2033b0 Mon Sep 17 00:00:00 2001
From: Zihua Li <i@zihua.li>
Date: Thu, 25 Jan 2024 14:02:38 +0800
Subject: [PATCH] Enable SSL for dev env

---
 .github/DEVELOPMENT.md           | 7 +++++--
 packages/quill/webpack.config.ts | 3 +++
 packages/website/.gitignore      | 3 ++-
 packages/website/env.js          | 2 +-
 packages/website/next.config.mjs | 8 ++++++++
 packages/website/package.json    | 2 +-
 6 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/.github/DEVELOPMENT.md b/.github/DEVELOPMENT.md
index be1ba9e817..240f3969ec 100644
--- a/.github/DEVELOPMENT.md
+++ b/.github/DEVELOPMENT.md
@@ -27,6 +27,9 @@ Start the development environment using:
 npm start
 ```
 
+> [!NOTE]
+> You might be prompted to enter your password. It's needed to set up the local SSL certificate. [Learn More](https://nextjs.org/docs/pages/api-reference/next-cli#https-for-local-development).
+
 This command starts two services:
 
 - Quill's webpack dev server
@@ -34,7 +37,7 @@ This command starts two services:
 
 These servers dynamically build and serve the latest copy of the source code.
 
-Access the running website at [localhost:9000](http://localhost:9000/). By default, the website will use your local Quill build, that includes all the examples in the website. This convenient setup allows for seamless development and ensures changes to Quill do not disrupt the website's content.
+Access the running website at [localhost:9000](https://localhost:9000/). By default, the website will use your local Quill build, that includes all the examples in the website. This convenient setup allows for seamless development and ensures changes to Quill do not disrupt the website's content.
 
 If you need to modify only the website's code, start the website with `npm start -w website``. This makes the website use the latest CDN version.
 
@@ -53,6 +56,6 @@ To execute the E2E tests, run:
 A standard development workflow involves:
 
 1. `npm start` - to run development services
-2. [localhost:9000/standalone/snow](http://localhost:9000/standalone/snow) - to interactively develop and test an isolated example
+2. [localhost:9000/standalone/snow](https://localhost:9000/standalone/snow) - to interactively develop and test an isolated example
 3. `npm run test:unit -w quill` - to run unit tests
 4. If everything is working, run the E2E tests
diff --git a/packages/quill/webpack.config.ts b/packages/quill/webpack.config.ts
index 5c9a0d1435..7228ce86ab 100644
--- a/packages/quill/webpack.config.ts
+++ b/packages/quill/webpack.config.ts
@@ -33,6 +33,9 @@ export default (env: Record<string, unknown>) =>
         directory: path.resolve(__dirname, './dist'),
       },
       hot: false,
+      client: {
+        webSocketURL: `wss://localhost:${process.env.npm_package_config_ports_website}/webpack-dev-server/ws`,
+      },
       allowedHosts: 'all',
       devMiddleware: {
         stats: 'minimal',
diff --git a/packages/website/.gitignore b/packages/website/.gitignore
index 3e72a4281d..0be314c6a8 100644
--- a/packages/website/.gitignore
+++ b/packages/website/.gitignore
@@ -1,4 +1,5 @@
 node_modules
 
 .next
-out
\ No newline at end of file
+out
+certificates
\ No newline at end of file
diff --git a/packages/website/env.js b/packages/website/env.js
index 212406c7b9..0ee2c39877 100644
--- a/packages/website/env.js
+++ b/packages/website/env.js
@@ -1,7 +1,7 @@
 const { version, homepage } = require('./package.json');
 
 const cdn = process.env.NEXT_PUBLIC_LOCAL_QUILL
-  ? `http://localhost:${process.env.npm_package_config_ports_webpack}`
+  ? `https://localhost:${process.env.npm_package_config_ports_website}/webpack-dev-server`
   : `https://cdn.jsdelivr.net/npm/quill@${version}/dist`;
 
 module.exports = {
diff --git a/packages/website/next.config.mjs b/packages/website/next.config.mjs
index c8fba63367..ad737e0c3d 100644
--- a/packages/website/next.config.mjs
+++ b/packages/website/next.config.mjs
@@ -45,4 +45,12 @@ export default withMDX()({
 
     return config;
   },
+  async rewrites() {
+    return [
+      {
+        source: '/webpack-dev-server/:path*',
+        destination: `http://localhost:${process.env.npm_package_config_ports_webpack}/:path*`,
+      },
+    ];
+  },
 });
diff --git a/packages/website/package.json b/packages/website/package.json
index 5606bc8230..da6a157bdf 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -7,7 +7,7 @@
   "keywords": [],
   "license": "BSD-3-Clause",
   "scripts": {
-    "dev": "PORT=$npm_package_config_ports_website next dev",
+    "dev": "PORT=$npm_package_config_ports_website next dev --experimental-https",
     "start": "npm run dev",
     "build": "next build",
     "lint": "next lint",