Shopware 6 Hot Reload Mode not working

Hello,

I’m trying to get the Shopware 6 Hot Reload Mode working using SSL but there seems to be a security problem when calling Shopware 6 tries calling the necessary JavaScript files.

System information:

Host:
OS: Ubuntu Budgie 18.04
Docker: 19.03.8, build afacb8b7f0
Docker-Compose: 1.25.4, build 8d51620a

Container:
PHP version: 7.3.1.2
MySQL version: 5.7

How to reproduce:
<project> = path to your htdocs directory in your project folder
<projectURL> = project URL in your /etc/hosts file

  1. Download Shopware using the latest installation package from https://www.shopware.com/en/changelog/#6-2-0
  2. Extract to <project> directory
  3. Add project to your /etc/hosts file
  4. Change DocumentRoot to /public using apache24.yml in your .devilbox directory
  5. Start Docker using docker-compose up httpd php bind mysql
  6. Navigate to in your browser, complete the installation dialog
  7. Go to htdocs/vendor/shopware/storefront/Resources/views/storefront/base.html.twig and change Line 1 from

{% set isHMRMode = app.request.headers.get('hot-reload-mode') %}
to
{% set isHMRMode = true %}

This enables Hot Reload Mode

  1. Log into Devilbox shell using ./shell.sh from your Devilbox installation
  2. Navigate to <project> directory in Devilbox shell
  3. Run <project>/bin/build-js.sh to install dependencies
  4. Run <project>/bin/watch-storefront.sh to start Webpack and compile necessary SCSS/JS files
  5. Open <project>/.env
  6. Change Line 1 to APP_ENV=dev to make use of the development environment
  7. Change Line 28 to SHOPWARE_HTTP_CACHE_ENABLED=0 to disable template caches
  8. Change Line 29 to SHOPWARE_HTTP_DEFAULT_TTL=0 to lower time to live for cached files, just in case
  9. Finally start <project>/bin/watch-storefront.sh to start Hot Reload Mode
  10. Open your in your browser
  11. Open developer tools (JavaScript console, etc)
  12. Go to Console, you should be able to see a bunch of errors mostly coming from /sockjs-node/info stating net::ERR_SSL_PROTOCOL_ERROR

This might be similar to this issues: https://github.com/cytopia/devilbox/issues/652
Shopware 6 is using a similar technique, just different tools: https://webpack.js.org/configuration/dev-server/

I’ve tried your solution from the GIT issue above, but no luck.
This is what I added to my docker-compose.override.yml:

php:
ports:
# ---- Format: ----
# [HOST-ADDR : ] HOST-PORT : DOCKER-PORT
- “9999:9999” # shopware 6 hot reload mode

I really hope you can help - this would really speed up the development workflow using Shopware 6.

If you need further information, please let me know.

Thank you in advance.