AWS SAM Lambda typescript project doesnt attach to debugger in VSCode - visual-studio-code

Question

I have used AWS SAM to initialize a typescript lambda project which I am editing in VSCode on Windows 10. I have also setup debug points in the typescript code and this is my launch.json
{
"configurations": [
{
"type": "aws-sam",
"request": "direct-invoke",
"invokeTarget": {
"target": "template",
"logicalId": "HelloWorldFunction",
"templatePath": "${workspaceFolder}/lambda-app/template.yaml"
},
"lambda": {
"runtime": "nodejs14.x"
},
"sam": {
"containerBuild": false,
"skipNewImageCheck": false
},
"api": {
"httpMethod": "get"
},
"name": "templatestyle"
},
{
"type": "aws-sam",
"request": "direct-invoke",
"invokeTarget": {
"target": "code",
"lambdaHandler": "app.lambdaHandler",
"projectRoot": "${workspaceFolder}/lambda-app/hello-world"
},
"lambda": {
"runtime": "nodejs14.x",
"payload": {
"json": {
"key1": "value1",
"key2": "value2",
"key3": "value3"
}
}
},
"sam": {
"containerBuild": false,
"skipNewImageCheck": false
},
"api": {
"httpMethod": "get"
},
"name": "basic"
}
]
}
This is my tsconfig.json
{
"compilerOptions": {
"target": "es2020",
"strict": true,
"preserveConstEnums": true,
"noEmit": true,
"sourceMap": true,
"module":"es2015",
"moduleResolution":"node",
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
},
"include": ["*"],
"exclude": ["node_modules", "**/*.test.ts"]
}
This is the code in app.ts
import { APIGatewayProxyEvent, APIGatewayProxyResult } from 'aws-lambda';
/**
*
* Event doc: https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html#api-gateway-simple-proxy-for-lambda-input-format
* #param {Object} event - API Gateway Lambda Proxy Input Format
*
* Return doc: https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html
* #returns {Object} object - API Gateway Lambda Proxy Output Format
*
*/
export const lambdaHandler = async (event: APIGatewayProxyEvent): Promise<APIGatewayProxyResult> => {
let response: APIGatewayProxyResult;
try {
response = {
statusCode: 200,
body: JSON.stringify({
message: 'hello world',
}),
};
} catch (err) {
console.log(err);
response = {
statusCode: 500,
body: JSON.stringify({
message: 'some error happened',
}),
};
}
return response;
};
When I select either of the debug configurations above, the break point only attaches in a file that is not part of what I created. It stops without a breakpoint on the first line below, which is seems to be in the path \var\runtime\index.js
Where did this file come from? Docker perhaps?. Also, why is it stopping here in this file and not in the breakpoint I put on my app.ts?
This is the result I get in the debug console, and the breakpoints I have set are not hit. How do I fix this?

Answer 1

By default the debugger will break on the first line of code. There is a switch to disable this. I don't see the command you are using for local invoke. I was able to get it to break on my source code by using the following:
sam local invoke <function logical id> --event events/event.json -d <port>
Function logical id is the name of your function in template.yml and port is the debug port to use. I used 9999. The command I used was
sam local invoke HelloWorldFunction --event events/event.json -d 9999