Skip to content

feat: toggle HMR (BrowserSync) via ENABLE_HMR#719

Merged
AnuragVasanwala merged 4 commits into
feat/tailwindfrom
feat/hmr
Jun 24, 2026
Merged

feat: toggle HMR (BrowserSync) via ENABLE_HMR#719
AnuragVasanwala merged 4 commits into
feat/tailwindfrom
feat/hmr

Conversation

@aryanjasala

Copy link
Copy Markdown
Member

BrowserSync live reload behind one switch — ENABLE_HMR in .env.local, read by both webpack and PHP. Default on, toggleable from npm run init. DISABLE_BS stays for the client-only case.

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a single master switch (ENABLE_HMR in .env.local) to control BrowserSync-based live reload across both the webpack build (server startup) and PHP (client script enqueue), making local development HMR easier to toggle per developer.

Changes:

  • Introduces ENABLE_HMR parsing in webpack.config.js and skips BrowserSync plugin setup when disabled.
  • Adds ENABLE_HMR gating in inc/Core/Assets.php so the BrowserSync client is only enqueued when the flag is enabled (while preserving DISABLE_BS as a client-only override).
  • Updates documentation and init scaffolding to expose/toggle the flag, and documents it in .env.local.example.

Reviewed changes

Copilot reviewed 4 out of 5 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
webpack.config.js Reads ENABLE_HMR and disables BrowserSync plugin creation when HMR is toggled off.
inc/Core/Assets.php Adds is_hmr_enabled() and gates BrowserSync client enqueue behind ENABLE_HMR.
docs/hmr.md Documents the new ENABLE_HMR master switch and clarifies DISABLE_BS as client-only.
bin/scaffold.config.js Adds an hmr feature toggle in npm run init to flip ENABLE_HMR in .env.local.
.env.local.example Adds ENABLE_HMR with explanation and defaults for local setup.

Comment thread inc/Core/Assets.php
Comment on lines 142 to 145
public function enqueue_browser_sync(): void {
if ( 'local' !== wp_get_environment_type() || $this->is_browser_sync_disabled() ) {
if ( 'local' !== wp_get_environment_type() || ! $this->is_hmr_enabled() || $this->is_browser_sync_disabled() ) {
return;
}
aryanjasala and others added 2 commits June 23, 2026 19:18
HMR (BrowserSync live reload) is now a toggleable feature, gated on a
single ENABLE_HMR flag in .env.local that both the build and PHP read:

- webpack only starts the BrowserSync server when ENABLE_HMR is not off
- Assets.php only enqueues the client under the same flag
- the scaffold feature flips ENABLE_HMR in .env.local on enable/disable

Default is on, so existing setups are unaffected. browser-sync deps stay
installed (they are dev-only), so the toggle is a fast local switch.
DISABLE_BS still works for the finer client-only case. Toggle from
`npm run init` (manage mode) or by editing .env.local directly.
Mirror the plugin skeleton's AssetsHmrTest so the theme's HMR feature has
the same coverage. Exercises the two private env-flag helpers in Assets via
a fresh instance per case (each re-reads .env.local):

- is_hmr_enabled(): defaults on when ENABLE_HMR is absent, off for
  0/false/no/off (case-insensitive), on for 1/true/yes/on
- is_browser_sync_disabled(): independent of HMR; off by default, on for
  truthy DISABLE_BS

Backs up and restores any real .env.local so the developer's file is left
untouched.
@Adi-ty Adi-ty requested a review from AnuragVasanwala June 23, 2026 16:09
@Adi-ty Adi-ty marked this pull request as ready for review June 23, 2026 16:09
@Adi-ty

Adi-ty commented Jun 23, 2026

Copy link
Copy Markdown

Rebased onto the updated #718 and added AssetsHmrTest (the https://github.com/rtCamp/features-plugin-skeleton/pull/707 had it; ours was missing).

Comment thread tests/php/inc/Core/AssetsHmrTest.php
Comment thread tests/php/inc/Core/AssetsHmrTest.php Outdated
Mark the demo modules (media-text block extension, theme options, author bio), example components and page-creation pattern with grouped wp:example markers so init can drop selected sets while keeping the rest. The three Main.php modules use keyed markers to scope their shared regions.
@AnuragVasanwala AnuragVasanwala merged commit 6886555 into feat/tailwind Jun 24, 2026
4 of 8 checks passed
@AnuragVasanwala AnuragVasanwala deleted the feat/hmr branch June 24, 2026 05:19
AnuragVasanwala pushed a commit that referenced this pull request Jun 24, 2026
* feat: wire the Tailwind theme-token webpack plugin when present

Gates GenerateTailwindThemePlugin (from @rtcamp/wp-tooling) on the entry
file src/css/frontend/tailwind.css, guard-requiring wp-tooling so the build
still works when it is absent. Dormant until the Tailwind feature creates
the entry.

* feat(scaffold): add Tailwind CSS opt-in feature

Toggleable in manage mode: copies the entry CSS + PostCSS config and adds
the tailwindcss / @tailwindcss/postcss devDeps; detected via the entry
file. The build side lives in webpack.config.js.

* docs(tailwind): fix stale default-enablement comments

functions.php now defaults ELEMENTARY_THEME_ENABLE_TAILWIND to false (the
scaffold feature flips it); the webpack token plugin is still entry-file gated
at build time, and the wp-tooling catch only skips that plugin, not Tailwind
compilation.

* fix(tailwind): consume @rtcamp/tailwind-config and gate enqueue at runtime

* feat: toggle HMR (BrowserSync) via ENABLE_HMR (#719)

* feat(scaffold): add HMR enable/disable feature

HMR (BrowserSync live reload) is now a toggleable feature, gated on a
single ENABLE_HMR flag in .env.local that both the build and PHP read:

- webpack only starts the BrowserSync server when ENABLE_HMR is not off
- Assets.php only enqueues the client under the same flag
- the scaffold feature flips ENABLE_HMR in .env.local on enable/disable

Default is on, so existing setups are unaffected. browser-sync deps stay
installed (they are dev-only), so the toggle is a fast local switch.
DISABLE_BS still works for the finer client-only case. Toggle from
`npm run init` (manage mode) or by editing .env.local directly.

* test(hmr): cover ENABLE_HMR master switch and DISABLE_BS override

Mirror the plugin skeleton's AssetsHmrTest so the theme's HMR feature has
the same coverage. Exercises the two private env-flag helpers in Assets via
a fresh instance per case (each re-reads .env.local):

- is_hmr_enabled(): defaults on when ENABLE_HMR is absent, off for
  0/false/no/off (case-insensitive), on for 1/true/yes/on
- is_browser_sync_disabled(): independent of HMR; off by default, on for
  truthy DISABLE_BS

Backs up and restores any real .env.local so the developer's file is left
untouched.

* test(hmr): isolate env reads from the real .env.local

* feat(scaffold): mark example sets for selective removal (#720)

Mark the demo modules (media-text block extension, theme options, author bio), example components and page-creation pattern with grouped wp:example markers so init can drop selected sets while keeping the rest. The three Main.php modules use keyed markers to scope their shared regions.

---------

Co-authored-by: Aditya Singh <adityasinghboss1234@gmail.com>

---------

Co-authored-by: Aditya Singh <adityasinghboss1234@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants