feat(dev-server): integrate with preview app command #49
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -183,6 +183,4 @@ FLAG DESCRIPTIONS | |
| This person can be anyone in the world! | ||
| ``` | ||
|
|
||
| <!-- commandsstop --> | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,76 @@ | ||
| /* | ||
| * Copyright (c) 2023, salesforce.com, inc. | ||
| * All rights reserved. | ||
| * Licensed under the BSD 3-Clause license. | ||
| * For full license text, see LICENSE.txt file in the repo root or https://opensource.org/licenses/BSD-3-Clause | ||
| */ | ||
|
|
||
| import path from 'node:path'; | ||
| import process from 'node:process'; | ||
| import { LWCServer, LogLevel, ServerConfig, Workspace, startLwcDevServer } from '@lwc/lwc-dev-server'; | ||
| import { Logger } from '@salesforce/core'; | ||
|
|
||
| const DEV_SERVER_PORT = 8081; | ||
|
There was a problem hiding this comment. The port needs to be configurable. This a pretty popular port number and we should anticipate that it might not be available. Can we add a new flag to There was a problem hiding this comment. @ravijayaramappa we may need to run it by Marcelino to discuss this. For example:
Maybe we should utilize our slack channel to discuss further with him and the devs? There was a problem hiding this comment. I like that idea of just putting it in the |
||
|
|
||
| /** | ||
| * Map sf cli log level to lwc dev server log level | ||
| * https://github.com/salesforcecli/cli/wiki/Code-Your-Plugin#logging-levels | ||
| * | ||
| * @param cliLogLevel | ||
| * @returns number | ||
| */ | ||
| function mapLogLevel(cliLogLevel: number): number { | ||
| switch (cliLogLevel) { | ||
| case 10: | ||
| return LogLevel.verbose; | ||
| case 20: | ||
| return LogLevel.debug; | ||
| case 30: | ||
| return LogLevel.info; | ||
| case 40: | ||
| return LogLevel.warn; | ||
| case 50: | ||
| return LogLevel.error; | ||
| case 60: | ||
| return LogLevel.silent; | ||
| default: | ||
| return LogLevel.error; | ||
| } | ||
| } | ||
|
|
||
| function createLWCServerConfig(source: string, logger: Logger): ServerConfig { | ||
| const rootDir = path.resolve(source, 'force-app/main/default'); | ||
|
There was a problem hiding this comment. Shouldn't the config be placed elsewhere? My guess is this path reflects a Salesforce VSCode project, as shown in the attached screenshot. The config is for LWR server and LWC server, right? Then, would the root folder be a more appropriate place for the config file to be created? 
There was a problem hiding this comment. I think the config file will be at the root folder. The value for And looking at line 58 I see that There was a problem hiding this comment. It's There was a problem hiding this comment.
There was a problem hiding this comment. The way I'm reading this code is that it is creating a You say in your comment that Here's what I'm trying to do for myself, @rax-it . I'm working on this repo too and I'm trying to figure out where the There was a problem hiding this comment. @sfdctaka I think I may have understood the root of your confusion here. There are 2 concepts of root directory, each serving a different purpose. For an SFDX project, the root directory of the entire SFDX project is the folder where the file Now inside the Suppose you have an SFDX project located at By setting If you have further questions on this, feel free to reach out to me on slack (so we don't pollute the comments/feed of this PR) @rax-it The assumption that for SFDX projects, the modules/components will always be under There was a problem hiding this comment. @maliroteh-sf I added sfdx config handling as per what information was available in developer docs. There was a problem hiding this comment. Yes that sounds about right. I also was looking at sfdxPackageDirsPattern which is subsequently used for example by getModulesDirs or by componentEntries |
||
| const namespacePaths: string[] = [rootDir]; | ||
|
|
||
| return { | ||
| rootDir, | ||
| port: DEV_SERVER_PORT, | ||
| protocol: 'wss', | ||
| host: 'localhost', | ||
rax-it marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| paths: namespacePaths, | ||
| workspace: Workspace.SfCli, | ||
| targets: ['LEX'], // should this be something else? | ||
rax-it marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| logLevel: mapLogLevel(logger.getLevel()), | ||
| }; | ||
| } | ||
|
|
||
| export async function startLWCServer(logger: Logger): Promise<LWCServer> { | ||
| const config = createLWCServerConfig(process.cwd(), logger); | ||
| let lwcDevServer: LWCServer | null = await startLwcDevServer(config); | ||
|
|
||
| const cleanup = (): void => { | ||
| if (lwcDevServer) { | ||
| lwcDevServer.stopServer(); | ||
| lwcDevServer = null; | ||
| } | ||
| }; | ||
|
|
||
| // normal exit flow | ||
| process.on('exit', cleanup); | ||
| // when a user presses ctrl+c | ||
| process.on('SIGINT', cleanup); | ||
| // when a user kills the process | ||
| process.on('SIGTERM', cleanup); | ||
rax-it marked this conversation as resolved.
Show resolved
Hide resolved
|
||
|
|
||
| return lwcDevServer; | ||
| } | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| /* | ||
| * Copyright (c) 2024, salesforce.com, inc. | ||
| * All rights reserved. | ||
| * Licensed under the BSD 3-Clause license. | ||
| * For full license text, see LICENSE.txt file in the repo root or https://opensource.org/licenses/BSD-3-Clause | ||
| */ | ||
|
|
||
| import { expect } from 'chai'; | ||
| import { Logger } from '@salesforce/core'; | ||
| import { LWCServer } from '@lwc/lwc-dev-server'; | ||
| import esmock from 'esmock'; | ||
| import * as devServer from '../../src/lwc-dev-server/index.js'; | ||
|
|
||
| describe('lwc-dev-server', () => { | ||
|
There was a problem hiding this comment. Can we have a test which can use a sample sfdx project and start the lwc dev server and stop it successfully? Like a sanity end-2-end test. |
||
| const server = { | ||
| stopServer: () => {}, | ||
| } as LWCServer; | ||
| let lwcDevServer: typeof devServer; | ||
|
|
||
| before(async () => { | ||
| lwcDevServer = await esmock<typeof devServer>('../../src/lwc-dev-server/index.js', { | ||
| '@lwc/lwc-dev-server': { | ||
| startLwcDevServer: async () => server, | ||
| }, | ||
| }); | ||
| }); | ||
|
|
||
| it('exports a startLWCServer function', () => { | ||
| expect(lwcDevServer.startLWCServer).to.be.a('function'); | ||
| }); | ||
|
|
||
| it('calling startLWCServer returns an LWCServer', async () => { | ||
| const s = await lwcDevServer.startLWCServer({ getLevel: () => 10 } as Logger); | ||
| expect(s).to.equal(server); | ||
| }); | ||
| }); | ||
Uh oh!
There was an error while loading. Please reload this page.