Skip to content

Commit 98d4e2a

Browse files
shazronpurplecabbage
shazron
and
purplecabbage
authored
feat: ACNA-3098 - allow action invocation of ES Modules / Typescript (#87)
* use dist folder (webpacked action source) * add ESM action, Typescript action * fix jsdoc * add eslint config * support DUMP_PARAMS input * add comment regarding ts-loader * add source-map output for webpack, add .vscode/launch.json * remove cached webpacked code * use aio-lib-runtime to build the app * add actions watcher * update README * fix unit tests * mock actionsWatcher * completed 100% coverage * specify version of @adobe/aio-lib-runtime for buildActions emptyDist param * run-dev tests code cleanup * fixed actions-watcher tests leaks * fix: require.cache cleanup, always build latest * require aio-lib-runtime with optimized builds --------- Co-authored-by: Jesse MacFadyen <purplecabbage@gmail.com>
1 parent 65d1190 commit 98d4e2a

21 files changed

Lines changed: 1087 additions & 110 deletions

File tree

‎README.md‎

Lines changed: 57 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,22 +7,19 @@
77
[![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)
88
[![Codecov Coverage](https://img.shields.io/codecov/c/github/adobe/aio-cli-plugin-app-dev/master.svg?style=flat-square)](https://codecov.io/gh/adobe/aio-cli-plugin-app-dev/)
99

10-
This command is a new way of looking at local development.
11-
This uses the approach of a simulator, rather than an emulator.
12-
13-
<!-- toc -->
14-
* [aio-cli-plugin-app-dev](#aio-cli-plugin-app-dev)
15-
<!-- tocstop -->
10+
- This command is a new way of looking at local development. This uses the approach of a simulator, rather than an emulator.
11+
- Supports ESM, and TypeScript actions.
12+
- [App Builder Debugging Docs](https://developer.adobe.com/app-builder/docs/guides/development/#debugging)
1613

1714
## Commands
1815
<!-- commands -->
19-
* [`aio app dev`](#aio-app-dev)
16+
- [`aio app dev`](#aio-app-dev)
2017

2118
## `aio app dev`
2219

2320
Run your App Builder app locally
2421

25-
```
22+
```sh
2623
USAGE
2724
$ aio app dev [-v] [--version] [-o] [-e <value>]
2825

@@ -48,6 +45,58 @@ By default the hostname will be `localhost` and the default port is `9080`. You
4845
4946
The command will try to use the default port, if it is not available it will find an open port to use instead.
5047
48+
## Visual Studio Code Webpack Debugging Support (Source Maps)
49+
50+
To enable step-by-step debugging in Visual Studio Code for your webpacked code, you will have to add source map support by adding a [custom webpack config](https://developer.adobe.com/app-builder/docs/guides/configuration/webpack-configuration/).
51+
52+
In the root of your project, add a `webpack-config.js` file:
53+
54+
```javascript
55+
module.exports = {
56+
devtool: 'inline-source-map'
57+
}
58+
```
59+
60+
## TypeScript Support
61+
62+
Install these node modules in your app:
63+
`npm install --save-dev ts-loader typescript`
64+
65+
In the root of your project, add a `webpack-config.js` file:
66+
67+
```javascript
68+
module.exports = {
69+
devtool: 'inline-source-map',
70+
module: {
71+
rules: [
72+
{
73+
// includes, excludes are in tsconfig.json
74+
test: /\.ts?$/,
75+
exclude: /node_modules/,
76+
use: 'ts-loader'
77+
}
78+
]
79+
}
80+
}
81+
```
82+
83+
In the root of your project, add a `tsconfig.json` file:
84+
85+
```json
86+
{
87+
"exclude": ["node_modules", "dist"],
88+
"compilerOptions": {
89+
"target": "ES6",
90+
"module": "ES6",
91+
"sourceMap": true
92+
}
93+
}
94+
```
95+
96+
There is a Visual Studio Code issue with TypeScript and inspecting variables by hovering your mouse over them:
97+
98+
<https://github.com/microsoft/vscode/issues/221503>
99+
51100
## Contributing
52101
53102
Contributions are welcomed! Read the [Contributing Guide](CONTRIBUTING.md) for more information.

‎e2e/test-project/.eslintrc.json‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"settings": {
3+
"jsdoc": {
4+
"ignorePrivate": true
5+
}
6+
},
7+
"parserOptions": {
8+
"ecmaVersion": "latest"
9+
}
10+
}

‎e2e/test-project/.vscode/launch.json‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"version": "0.3.0",
3+
"configurations": [
4+
{
5+
"name": "App Builder: debug actions",
6+
"type": "node-terminal",
7+
"request": "launch",
8+
"command": "aio app dev",
9+
"skipFiles": [
10+
"<node_internals>/**/*.js"
11+
]
12+
}, {
13+
"name": "App Builder: debug full stack",
14+
"type": "node-terminal",
15+
"request": "launch",
16+
"command": "aio app dev",
17+
"sourceMapPathOverrides": {
18+
"/__parcel_source_root/*": "${webRoot}/*"
19+
},
20+
"skipFiles": [
21+
"<node_internals>/**/*.js"
22+
],
23+
"serverReadyAction": {
24+
"pattern": "server running on port : ([0-9]+)",
25+
"uriFormat": "https://localhost:%s",
26+
"action": "debugWithChrome",
27+
"webRoot": "${workspaceFolder}"
28+
}
29+
}
30+
]
31+
}

‎e2e/test-project/package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@
1717
"regenerator-runtime": "^0.13.5"
1818
},
1919
"devDependencies": {
20+
"ts-loader": "^9.5.1",
21+
"typescript": "^5.5.4",
2022
"@babel/core": "^7.8.7",
2123
"@babel/plugin-transform-react-jsx": "^7.8.3",
2224
"@babel/polyfill": "^7.8.7",

‎e2e/test-project/src/dx-excshell-1/actions/addNumbers/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ async function addNumbers (params) {
3232
const sum = nums.reduce((accum, num) => accum + parseInt(num.trim(), 10), 0)
3333
return {
3434
payload: sum, // to be passed to other actions in the sequence as part of params
35-
body: {
35+
body: {
3636
payload: sum // sent to the http client for a stand-alone call
3737
}
3838
}

‎e2e/test-project/src/dx-excshell-1/actions/esmAction/index.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/*
2+
Copyright 2024 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
6+
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
12+
13+
/**
14+
* The main function.
15+
*
16+
* @param {object} params the parameters
17+
* @returns {object} runtime response object
18+
*/
19+
export async function main (params) {
20+
const response = {
21+
statusCode: 200,
22+
params,
23+
body: 'you were successful with esm'
24+
}
25+
return response
26+
}

‎e2e/test-project/src/dx-excshell-1/actions/post-data/index.js‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,25 @@
1-
async function main(params) {
1+
/*
2+
Copyright 2024 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
6+
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
12+
13+
/**
14+
* The main function.
15+
*
16+
* @param {object} params the parameters
17+
* @returns {object} runtime response object
18+
*/
19+
async function main (params) {
20+
if (params.DUMP_PARAMS) {
21+
console.log('params', JSON.stringify(params, null, 2))
22+
}
223
const response = {
324
statusCode: 200,
425
body: {
@@ -7,4 +28,4 @@ async function main(params) {
728
}
829
return response
930
}
10-
exports.main = main
31+
exports.main = main

‎e2e/test-project/src/dx-excshell-1/actions/post-raw-data/index.js‎

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,26 @@
1-
async function main(params) {
1+
/*
2+
Copyright 2024 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
6+
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
12+
13+
/**
14+
* The main function.
15+
*
16+
* @param {object} params the parameters
17+
* @returns {object} runtime response object
18+
*/
19+
async function main (params) {
20+
if (params.DUMP_PARAMS) {
21+
console.log('params', JSON.stringify(params, null, 2))
22+
}
23+
224
const response = {
325
statusCode: 200,
426
body: {
@@ -7,4 +29,4 @@ async function main(params) {
729
}
830
return response
931
}
10-
exports.main = main
32+
exports.main = main

‎e2e/test-project/src/dx-excshell-1/actions/tsAction/index.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/*
2+
Copyright 2024 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
6+
7+
Unless required by applicable law or agreed to in writing, software distributed under
8+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9+
OF ANY KIND, either express or implied. See the License for the specific language
10+
governing permissions and limitations under the License.
11+
*/
12+
13+
/**
14+
* The main function.
15+
*
16+
* @returns {object} runtime response object
17+
*/
18+
export function main(params: object) {
19+
const response = {
20+
statusCode: 200,
21+
params,
22+
body: 'you were successful with typescript'
23+
}
24+
return response
25+
}

‎e2e/test-project/src/dx-excshell-1/ext.config.yaml‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ runtimeManifest:
4242
runtime: nodejs:18
4343
inputs:
4444
LOG_LEVEL: debug
45+
DUMP_PARAMS: $DUMP_PARAMS
4546
annotations:
4647
final: true
4748
post-raw-data:
@@ -50,6 +51,7 @@ runtimeManifest:
5051
runtime: nodejs:18
5152
inputs:
5253
LOG_LEVEL: debug
54+
DUMP_PARAMS: $DUMP_PARAMS
5355
annotations:
5456
final: true
5557
noAdobeAuth:
@@ -124,3 +126,19 @@ runtimeManifest:
124126
LOG_LEVEL: debug
125127
annotations:
126128
final: true
129+
esmAction:
130+
function: actions/esmAction/index.js
131+
web: 'yes'
132+
runtime: nodejs:18
133+
inputs:
134+
LOG_LEVEL: debug
135+
annotations:
136+
final: true
137+
tsAction:
138+
function: actions/tsAction/index.ts
139+
web: 'yes'
140+
runtime: nodejs:18
141+
inputs:
142+
LOG_LEVEL: debug
143+
annotations:
144+
final: true

0 commit comments

Comments
 (0)