Skip to content

Commit 77e4a42

Browse files
matz3matz3
committed
feat(cli): Enable liveReload by default for ui5 serve
- Add new `--live-reload` CLI flag (defaults to true) for the `ui5 serve` command. Pass `--no-live-reload` to disable it. - The flag overrides the `server.settings.liveReload` setting in the project's `ui5.yaml`. - When neither the CLI flag nor the configuration sets a value, live reload is enabled by default. JIRA: CPOUI5FOUNDATION-1224
1 parent 9fee705 commit 77e4a42

3 files changed

Lines changed: 108 additions & 3 deletions

File tree

‎internal/documentation/docs/updates/migrate-v5.md‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ Or update your global install via: `npm i --global @ui5/cli@next`
1717

1818
- **Rename: Command Option `--cache-mode` is now `--snapshot-cache`**
1919

20+
- **@ui5/server: Live Reload is enabled by default for `ui5 serve`**
21+
2022

2123
## Node.js and npm Version Support
2224

@@ -206,6 +208,19 @@ Delete the custom `test/Test.qunit.html` file from your test directory. This fil
206208
Depending on your project setup, you might need to update additional paths in configuration files or test runners to reflect the new structure.
207209
The test suite is now served under the standard `/test-resources/` path with the component's full namespace (e.g. `/test-resources/sap/ui/demo/todo/testsuite.qunit.html`).
208210

211+
## Live Reload
212+
213+
UI5 CLI v5 introduces a built-in [Live Reload](../pages/Server.md#livereload) feature for the development server. When running `ui5 serve`, the browser automatically reloads whenever project sources change. Live Reload is implemented via a WebSocket connection.
214+
215+
Live Reload is **enabled by default**. It can be controlled via:
216+
217+
- The new `--live-reload` CLI flag for `ui5 serve` (defaults to `true`). Pass `--no-live-reload` to disable it.
218+
- The new `server.settings.liveReload` configuration option in `ui5.yaml`. This setting is only available with [Specification Version 5.0](../pages/Configuration#specification-version-5-0) and higher.
219+
220+
::: warning Custom Live Reload Middleware
221+
If your project uses a custom middleware that provides live reload functionality, the page may refresh more often than necessary when combined with the built-in feature. When upgrading, either remove the custom middleware or disable the built-in Live Reload via the `--no-live-reload` CLI flag or the `server.settings.liveReload` configuration option.
222+
:::
223+
209224
## Removal of Standard Server Middleware
210225

211226
The following middleware has been removed from the [standard middlewares list](../pages/Server.md#standard-middleware):

‎packages/cli/lib/cli/commands/serve.js‎

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,13 @@ serve.builder = function(cli) {
3636
default: false,
3737
type: "boolean"
3838
})
39+
.option("live-reload", {
40+
describe:
41+
"Automatically reload the browser when project sources change. " +
42+
"Overrides the 'liveReload' setting in the project's server configuration",
43+
defaultDescription: "true",
44+
type: "boolean"
45+
})
3946
.option("accept-remote-connections", {
4047
describe: "Accept remote connections. By default the server only accepts connections from localhost",
4148
default: false,
@@ -109,7 +116,7 @@ serve.builder = function(cli) {
109116
"The 'Default' behavior is to invalidate the cache after 9 hours. 'Force' uses the cache only and " +
110117
"does not create any requests. 'Off' invalidates any existing cache and updates from the repository",
111118
type: "string",
112-
defaultDescription: "Default", // Use "defaultdescription" to allow undefined (needed for evaluation)
119+
defaultDescription: "Default", // Use "defaultDescription" to allow undefined (needed for evaluation)
113120
choices: ["Default", "Force", "Off"],
114121
})
115122
.example("ui5 serve", "Start a web server for the current project")
@@ -165,11 +172,22 @@ serve.handler = async function(argv) {
165172
}
166173
}
167174

175+
let liveReload = argv.liveReload;
176+
if (liveReload === undefined) {
177+
const serverSettings = graph.getRoot().getServerSettings();
178+
if (serverSettings && serverSettings.liveReload !== undefined) {
179+
liveReload = serverSettings.liveReload;
180+
} else {
181+
liveReload = true;
182+
}
183+
}
184+
168185
const serverConfig = {
169186
port,
170187
changePortIfInUse,
171188
h2: argv.h2,
172189
simpleIndex: !!argv.simpleIndex,
190+
liveReload: !!liveReload,
173191
acceptRemoteConnections: !!argv.acceptRemoteConnections,
174192
cert: argv.h2 ? argv.cert : undefined,
175193
key: argv.h2 ? argv.key : undefined,

‎packages/cli/test/lib/cli/commands/serve.js‎

Lines changed: 74 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,7 @@ URL: http://localhost:8080
122122
sendSAPTargetCSP: false,
123123
serveCSPReports: false,
124124
simpleIndex: false,
125+
liveReload: true,
125126
}
126127
]);
127128
t.is(typeof server.serve.getCall(0).args[2], "function");
@@ -171,6 +172,7 @@ URL: https://localhost:8443
171172
sendSAPTargetCSP: false,
172173
serveCSPReports: false,
173174
simpleIndex: false,
175+
liveReload: true,
174176
}
175177
]);
176178

@@ -223,6 +225,7 @@ URL: http://localhost:8080
223225
sendSAPTargetCSP: false,
224226
serveCSPReports: false,
225227
simpleIndex: false,
228+
liveReload: true,
226229
}
227230
]);
228231
});
@@ -265,6 +268,7 @@ URL: http://localhost:8080
265268
sendSAPTargetCSP: false,
266269
serveCSPReports: false,
267270
simpleIndex: false,
271+
liveReload: true,
268272
}
269273
]);
270274

@@ -312,6 +316,7 @@ URL: http://localhost:8080
312316
sendSAPTargetCSP: false,
313317
serveCSPReports: false,
314318
simpleIndex: false,
319+
liveReload: true,
315320
}
316321
]);
317322

@@ -356,6 +361,7 @@ URL: http://localhost:8080
356361
sendSAPTargetCSP: false,
357362
serveCSPReports: false,
358363
simpleIndex: false,
364+
liveReload: true,
359365
}
360366
]);
361367
});
@@ -393,7 +399,8 @@ URL: http://localhost:8080
393399
port: 8080,
394400
sendSAPTargetCSP: false,
395401
serveCSPReports: false,
396-
simpleIndex: false
402+
simpleIndex: false,
403+
liveReload: true
397404
}
398405
]);
399406
});
@@ -434,7 +441,8 @@ URL: http://localhost:8080
434441
port: 8080,
435442
sendSAPTargetCSP: false,
436443
serveCSPReports: false,
437-
simpleIndex: false
444+
simpleIndex: false,
445+
liveReload: true
438446
}
439447
]);
440448
});
@@ -473,6 +481,7 @@ URL: http://localhost:8080
473481
sendSAPTargetCSP: false,
474482
serveCSPReports: false,
475483
simpleIndex: false,
484+
liveReload: true,
476485
}
477486
]);
478487
});
@@ -511,6 +520,7 @@ URL: http://localhost:8080
511520
sendSAPTargetCSP: false,
512521
serveCSPReports: false,
513522
simpleIndex: false,
523+
liveReload: true,
514524
}
515525
]);
516526
});
@@ -549,6 +559,7 @@ URL: http://localhost:8080
549559
sendSAPTargetCSP: false,
550560
serveCSPReports: false,
551561
simpleIndex: false,
562+
liveReload: true,
552563
}
553564
]);
554565
});
@@ -587,6 +598,7 @@ URL: http://localhost:8080
587598
sendSAPTargetCSP: false,
588599
serveCSPReports: false,
589600
simpleIndex: false,
601+
liveReload: true,
590602
}
591603
]);
592604
});
@@ -626,6 +638,7 @@ URL: http://localhost:8080
626638
sendSAPTargetCSP: false,
627639
serveCSPReports: false,
628640
simpleIndex: false,
641+
liveReload: true,
629642
}
630643
]);
631644
});
@@ -664,6 +677,7 @@ URL: http://localhost:8080
664677
sendSAPTargetCSP: true,
665678
serveCSPReports: false,
666679
simpleIndex: false,
680+
liveReload: true,
667681
}
668682
]);
669683
});
@@ -702,6 +716,7 @@ URL: http://localhost:8080
702716
sendSAPTargetCSP: false,
703717
serveCSPReports: true,
704718
simpleIndex: false,
719+
liveReload: true,
705720
}
706721
]);
707722
});
@@ -740,10 +755,64 @@ URL: http://localhost:8080
740755
sendSAPTargetCSP: false,
741756
serveCSPReports: false,
742757
simpleIndex: true,
758+
liveReload: true,
743759
}
744760
]);
745761
});
746762

763+
test.serial("ui5 serve --no-live-reload", async (t) => {
764+
const {argv, serve, server} = t.context;
765+
766+
argv.liveReload = false;
767+
768+
serve.handler(argv);
769+
await t.context.handlerReady;
770+
771+
t.is(server.serve.callCount, 1);
772+
t.is(server.serve.getCall(0).args[1].liveReload, false);
773+
});
774+
775+
test.serial("ui5 serve --live-reload", async (t) => {
776+
const {argv, serve, server} = t.context;
777+
778+
argv.liveReload = true;
779+
780+
serve.handler(argv);
781+
await t.context.handlerReady;
782+
783+
t.is(server.serve.callCount, 1);
784+
t.is(server.serve.getCall(0).args[1].liveReload, true);
785+
});
786+
787+
test.serial("ui5 serve with ui5.yaml liveReload=false setting", async (t) => {
788+
const {argv, serve, server, getServerSettings} = t.context;
789+
790+
getServerSettings.returns({
791+
liveReload: false
792+
});
793+
794+
serve.handler(argv);
795+
await t.context.handlerReady;
796+
797+
t.is(server.serve.callCount, 1);
798+
t.is(server.serve.getCall(0).args[1].liveReload, false);
799+
});
800+
801+
test.serial("ui5 serve --live-reload overrides ui5.yaml liveReload setting", async (t) => {
802+
const {argv, serve, server, getServerSettings} = t.context;
803+
804+
argv.liveReload = true;
805+
getServerSettings.returns({
806+
liveReload: false
807+
});
808+
809+
serve.handler(argv);
810+
await t.context.handlerReady;
811+
812+
t.is(server.serve.callCount, 1);
813+
t.is(server.serve.getCall(0).args[1].liveReload, true);
814+
});
815+
747816
test.serial("ui5 serve with ui5.yaml port setting", async (t) => {
748817
const {argv, serve, graph, server, fakeGraph, getServerSettings} = t.context;
749818

@@ -785,6 +854,7 @@ URL: http://localhost:3333
785854
sendSAPTargetCSP: false,
786855
serveCSPReports: false,
787856
simpleIndex: false,
857+
liveReload: true,
788858
}
789859
]);
790860
});
@@ -837,6 +907,7 @@ URL: https://localhost:4444
837907
sendSAPTargetCSP: false,
838908
serveCSPReports: false,
839909
simpleIndex: false,
910+
liveReload: true,
840911
}
841912
]);
842913

@@ -896,6 +967,7 @@ URL: https://localhost:5555
896967
sendSAPTargetCSP: false,
897968
serveCSPReports: false,
898969
simpleIndex: false,
970+
liveReload: true,
899971
}
900972
]);
901973

0 commit comments

Comments
 (0)