@mavogel/cdk-vscode-server 0.0.2

package/README.md

@@ -0,0 +1,183 @@
+[![Build Status](https://github.com/MV-Consulting/cdk-vscode-server/actions/workflows/build.yml/badge.svg)](https://github.com/MV-Consulting/cdk-vscode-server/actions/workflows/build.yml)
+[![ESLint Code Formatting](https://img.shields.io/badge/code_style-eslint-brightgreen.svg)](https://eslint.org)
+[![Latest release](https://img.shields.io/github/release/MV-Consulting/cdk-vscode-server.svg)](https://github.com/MV-Consulting/cdk-vscode-server/releases)
+
+# cdk-vscode-server
+
+Running your dev IDE vscode on AWS for development and workshop purposes.
+
+> [!Note]
+> This construct is designed for workshop purposes and does not fulfill all security and authentication best practices. 
+
+## Table of Contents
+
+- [Features](#features)
+- [Usage](#usage)
+- [Solution Design](#solution-design)
+- [Inspiration](#inspiration)
+
+## Features
+
+- ⚡ **Quick Setup**: Spin up and configure your [vscode](https://code.visualstudio.com/) server in under 10 minutes in your AWS account
+- 📏 **Best Practice Setup**: Set up with [projen](https://projen.io/) and a [single configuration file](./.projenrc.ts) to keep your changes centralized.
+- 🤹‍♂️ **Pre-installed packages**: Besides the [vscode](https://code.visualstudio.com/) server, other tools and software packages such as `git`, `docker`, `awscli` `nodejs` and `python` are pre-installed on the EC2 instance.
+- 🏗️ **Extensibility**: Pass in properties to the construct, which start with `additional*`. They allow you to extend the configuration to your needs. There are more to come...
+
+## Usage
+The following steps get you started:
+
+1. Create a new `awscdk-app` via
+```bash
+npx projen new awscdk-app-ts --package-manager=npm
+```
+3. Add `@mavogel/cdk-vscode-server` as a dependency to your project in the `.projenrc.ts` file
+4. Run `yarn run projen` to install it
+5. Add the following to the `src/main.ts` file:
+```ts
+import { App, Stack, StackProps } from 'aws-cdk-lib';
+import * as ec2 from 'aws-cdk-lib/aws-ec2';
+import * as iam from 'aws-cdk-lib/aws-iam';
+import { Construct } from 'constructs';
+import { 
+  LinuxArchitectureType, 
+  LinuxFlavorType, 
+  VSCodeServer
+} from '@mavogel/cdk-vscode-server';
+
+export class MyStack extends Stack {
+  constructor(scope: Construct, id: string, props: StackProps = {}) {
+    super(scope, id, props);
+
+    new VSCodeServer(this, 'vscode', {
+      // for example (or simply use the defaults by not setting the properties)
+      instanceVolumeSize: 8,
+      instanceClass: ec2.InstanceClass.M7G,
+      instanceSize: ec2.InstanceSize.LARGE,
+      instanceOperatingSystem: LinuxFlavorType.UBUNTU_22,
+      instanceCpuArchitecture: LinuxArchitectureType.ARM,
+      
+      // 👇🏽 or if you want to give the InstanceRole more permissions
+      additionalInstanceRolePolicies: [
+        new iam.PolicyStatement({
+          effect: iam.Effect.ALLOW,
+          actions: [
+            'codebuild:*',
+          ],
+          resources: [
+            `arn:aws:codebuild:*:${Stack.of(this).account}:*/*`,
+          ],
+        }),
+      ]
+      
+      // and more... 💡
+    });
+  }
+}
+
+const env = {
+  account: '123456789912',
+  region: 'eu-central-1',
+};
+
+const app = new App();
+new MyStack(app, 'vscode-server', { env });
+app.synth();
+```
+
+and deploy it
+```bash
+npx projen build
+npx projen deploy
+```
+
+with the output
+```console
+✨  Deployment time: 509.87s
+
+Outputs:
+dev.vscodedomainName6729AA39 = https://d1foo65bar4baz.cloudfront.net/?folder=/Workshop
+dev.vscodepassword64FBCA12 = foobarbaz
+```
+
+> [!Important]
+> There are issues with copy pasting into the VSCode terminal within the Firefox browser (2025-01-12)
+
+Then open the domain name in your favorite browser and you'd see the following login screen:
+![vscode-server-ui-login](docs/img/vscode-server-ui-login-min.png)
+
+After entering the password, you are logged into VSCode and can start coding :tada:
+
+![vscode-server-ui](docs/img/vscode-server-ui-min.png)
+
+## Solution Design
+
+<details>
+  <summary>... if you're curious about click here for the details</summary>
+
+![vscode-server-solution-design](docs/img/vscode-server.drawio-min.png)
+
+</details>
+
+## Inspiration
+This project was created based on the following inspiration
+
+- [vscode-on-ec2-for-prototyping](https://github.com/aws-samples/vscode-on-ec2-for-prototyping): as baseline, which unfortunately was outdated
+- [aws-terraform-dev-container](https://github.com/awslabs/aws-terraform-dev-container): as baseline for terraform, but unfortunately also outdated
+- [java-on-aws-workshop-ide-only.yaml](https://github.com/aws-samples/java-on-aws/blob/main/labs/unicorn-store/infrastructure/cfn/java-on-aws-workshop-ide-only.yaml): an already synthesized cloudformation stack, which used mostly python as the custom resources
+- [fleet-workshop-team-stack-self.json](https://static.us-east-1.prod.workshops.aws/public/cc4aa67e-5b7a-4df1-abf7-c42502899a25/assets/fleet-workshop-team-stack-self.json): also an already synthesized cloudformation stack, which did much more as I currently implemented here. 
+- [eks-workshop-vscode-cfn.yaml](https://github.com/aws-samples/eks-workshop-v2/blob/main/lab/cfn/eks-workshop-vscode-cfn.yaml): another great baseline
+
+## Unlock the full potential of your AWS cloud infrastructure - Work with us!
+
+> [!TIP]
+> Bring your AWS Infrastructure with [MV Consulting](https://manuel-vogel.de/) to a new level. Let's raise your bar! We ship well-architected, resilient, operationally efficient, performance- and cost-optimized AWS solutions. They are designed to scale using Infrastructure as Code (IaC), DevOps best-practices and tailored to cloud-native systems for your businesses.
+>
+> Our Approach:
+>
+> - **Tailored AWS Solutions**: Custom-built and adapted for your unique business needs
+> - **Future-Proof Architecture**: Scalable designs that grow with you
+> - **Cloud-Native in-mind**: Modern and optimized for cloud-native usage
+> - **Empowerment Through Ownership**: Your business, your infrastructure, our expertise
+>
+> Why Choose Us:
+> - 7+ Years of AWS Experience
+> - 12x AWS Certified, including Solutions Architect & DevOps Engineer Professional
+> - 5x Kubernetes Certified with proven deep knowledge and profound hands-on experience
+> - Proven Track Record + transparent open source code and Testimonials
+> - For us business drives tech and not the other way around
+>
+> Ready to elevate your AWS Infrastructure?
+>
+> <a href="https://manuel-vogel.de/contact"><img alt="Schedule your call" src="https://img.shields.io/badge/schedule%20your%20call-success.svg?style=for-the-badge"/></a>
+> <details><summary>☁️ <strong>Discover more about my one-person business: MV Consulting</strong></summary>
+>
+> <br/>
+>
+> Hi, I'm Manuel – AWS expert and founder of [MV Consulting](https://manuel-vogel.de). With over a decade of hands-on experience, I specialized myself in deploying well-architected, highly scalable and cost-effective AWS Solutions using Infrastructure as Code (IaC).
+>
+> #### When you work with me, you're getting a package deal of expertise and personalized service:
+>
+> - **AWS IaC Proficiency**: I bring deep AWS CDK and [terraform](https://www.terraform.io/) knowledge to the table, ensuring your infrastructure is not just maintainable and scalable, but also fully automated.
+> - **AWS Certified**: [Equipped with 12 AWS Certifications](https://www.credly.com/users/manuel-vogel/badges), including Solutions Architect & DevOps Engineer Professional, to ensure best practices across diverse cloud scenarios.
+> - **Direct Access**: You work with me, not a team of managers. Expect quick decisions and high-quality work.
+> - **Tailored Solutions**: Understanding that no two businesses are alike, I Custom-fit cloud infrastructure for your unique needs.
+> - **Cost-Effective**: I'll optimize your AWS spending without cutting corners on performance or security.
+> - **Seamless CI/CD**: I'll set up smooth CI/CD processes using GitHub Actions or Gitlab CI, making changes a breeze through Pull Requests.
+>
+> *My mission is clear: I'll free you from infrastructure and automation headaches so you can focus on what truly matters – your core business.*
+>
+> Ready to unlock the full potential of the AWS Cloud?
+>
+> <a href="https://manuel-vogel.de/contact"><img alt="Schedule your call" src="https://img.shields.io/badge/schedule%20your%20call-success.svg?style=for-the-badge"/></a>
+> </details>
+
+## Acknowledgements
+
+Big thank you to the creators of [projen](https://github.com/projen/projen). This project stands on the shoulders of giants, made possible by their pioneering work in simplifying cloud infrastructure projects!
+
+## Author
+
+[Manuel Vogel](https://manuel-vogel.de/about/)
+
+[![](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/manuel-vogel)
+[![](https://img.shields.io/badge/GitHub-2b3137?style=for-the-badge&logo=github&logoColor=white)](https://github.com/mavogel)

package/assets/installer/installer.lambda/index.js

@@ -0,0 +1,112 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/installer/installer.lambda.ts
+var installer_lambda_exports = {};
+__export(installer_lambda_exports, {
+  handler: () => handler
+});
+module.exports = __toCommonJS(installer_lambda_exports);
+var import_client_ssm = require("@aws-sdk/client-ssm");
+var ssm = new import_client_ssm.SSM();
+var SLEEP_MS = 2900;
+var handler = async (event, context) => {
+  console.log("Event: %j", { ...event, ResponseURL: "..." });
+  if (event.RequestType !== "Create") {
+    return {};
+  }
+  const resourceProperties = event.ResourceProperties;
+  const instanceId = event.ResourceProperties.InstanceId;
+  const documentName = event.ResourceProperties.DocumentName;
+  const cloudWatchLogGroupName = event.ResourceProperties.CloudWatchLogGroupName;
+  console.log("ResourceProperties raw: %j", resourceProperties);
+  console.log("InstanceId: %s", event.ResourceProperties.InstanceId);
+  console.log("VSCodePassword: %s", event.ResourceProperties.VSCodePassword);
+  const resourcePropertiesPartial = resourceProperties;
+  console.log("ResourceProperties before: %j", resourcePropertiesPartial);
+  delete resourcePropertiesPartial.ServiceToken;
+  if (resourcePropertiesPartial.ServiceTimeout) {
+    delete resourcePropertiesPartial.ServiceTimeout;
+  }
+  delete resourcePropertiesPartial.InstanceId;
+  delete resourcePropertiesPartial.DocumentName;
+  delete resourcePropertiesPartial.CloudWatchLogGroupName;
+  if (resourcePropertiesPartial.PhysicalResourceId) {
+    delete resourcePropertiesPartial.PhysicalResourceId;
+  }
+  console.log("ResourceProperties filtered after: %j", resourcePropertiesPartial);
+  const parameters = {};
+  for (const [key, value] of Object.entries(resourcePropertiesPartial)) {
+    parameters[key] = [value];
+  }
+  console.log("mapped parameters: %j", parameters);
+  let attemptNo = 0;
+  let timeRemaining = context.getRemainingTimeInMillis();
+  console.log(`Running SSM Document '${documentName}' on EC2 instance '${instanceId}'. Logging to '${cloudWatchLogGroupName}' with parameters: '${JSON.stringify(parameters)}'`);
+  while (true) {
+    attemptNo += 1;
+    console.log(`Attempt: ${attemptNo}. Time Remaining: ${timeRemaining / 1e3}s`);
+    try {
+      const response = await ssm.sendCommand({
+        DocumentName: documentName,
+        InstanceIds: [instanceId],
+        CloudWatchOutputConfig: {
+          CloudWatchLogGroupName: cloudWatchLogGroupName,
+          CloudWatchOutputEnabled: true
+        },
+        Parameters: parameters
+      });
+      console.log(`response: ${JSON.stringify(response)}`);
+      const command = response.Command;
+      const commandId = command.CommandId;
+      const responseData = { CommandId: commandId };
+      switch (command.Status) {
+        case "Pending":
+        case "InProgress":
+          timeRemaining = context.getRemainingTimeInMillis();
+          if (timeRemaining > SLEEP_MS) {
+            console.log(`Instance ${instanceId} not ready: 'InProgress'. Sleeping: ${SLEEP_MS / 1e3}s`);
+            await new Promise((resolve) => setTimeout(resolve, SLEEP_MS));
+            break;
+          } else {
+            throw new Error(`SSM Document ${documentName} on EC2 instance ${instanceId} timed out while lambda in progress`);
+          }
+        case "Success":
+          console.log(`Instance ${instanceId} successfully bootstrapped`);
+          return { Data: responseData };
+        case "TimedOut":
+          throw new Error(`SSM Document ${documentName} on EC2 instance ${instanceId} timed out`);
+        case "Cancelled":
+          throw new Error(`SSM Document ${documentName} on EC2 instance ${instanceId} cancelled`);
+        case "Failed":
+          throw new Error(`SSM Document ${documentName} on EC2 instance ${instanceId} failed`);
+        default:
+          throw new Error(`SSM Document ${documentName} on EC2 instance ${instanceId} status ${command.Status}`);
+      }
+      return { Data: responseData };
+    } catch (error) {
+      console.log(error);
+      throw error;
+    }
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  handler
+});

package/assets/secret-retriever/secret-retriever.lambda/index.js

@@ -0,0 +1,57 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/secret-retriever/secret-retriever.lambda.ts
+var secret_retriever_lambda_exports = {};
+__export(secret_retriever_lambda_exports, {
+  handler: () => handler
+});
+module.exports = __toCommonJS(secret_retriever_lambda_exports);
+var import_client_secrets_manager = require("@aws-sdk/client-secrets-manager");
+var secretsManager = new import_client_secrets_manager.SecretsManager();
+var handler = async (event) => {
+  console.log("Event: %j", { ...event, ResponseURL: "..." });
+  if (event.RequestType === "Delete") {
+    return {};
+  }
+  const secretArn = event.ResourceProperties.SecretArn;
+  console.log("secretArn: %j", secretArn);
+  try {
+    const secret = await secretsManager.getSecretValue({
+      SecretId: secretArn
+    });
+    const secretValue = secret.SecretString;
+    console.log("secretValue: %j", secretValue);
+    const parsedSecretValue = JSON.parse(secretValue);
+    console.log("secretValue is JSON: %j", parsedSecretValue);
+    return {
+      Data: {
+        secretValue: parsedSecretValue,
+        secretPasswordValue: parsedSecretValue.password
+      }
+    };
+  } catch (error) {
+    console.error(error);
+    throw error;
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  handler
+});

package/docs/img/vscode-server.drawio

@@ -0,0 +1,108 @@
+<mxfile host="app.diagrams.net" agent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36" version="24.7.6">
+  <diagram id="Ht1M8jgEwFfnCIfOTk4-" name="Page-1">
+    <mxGraphModel dx="2215" dy="605" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
+      <root>
+        <mxCell id="0" />
+        <mxCell id="1" parent="0" />
+        <mxCell id="UEzPUAAOIrF-is8g5C7q-74" value="AWS Cloud" style="points=[[0,0],[0.25,0],[0.5,0],[0.75,0],[1,0],[1,0.25],[1,0.5],[1,0.75],[1,1],[0.75,1],[0.5,1],[0.25,1],[0,1],[0,0.75],[0,0.5],[0,0.25]];outlineConnect=0;gradientColor=none;html=1;whiteSpace=wrap;fontSize=12;fontStyle=0;shape=mxgraph.aws4.group;grIcon=mxgraph.aws4.group_aws_cloud_alt;strokeColor=#232F3E;fillColor=none;verticalAlign=top;align=left;spacingLeft=30;fontColor=#232F3E;dashed=0;labelBackgroundColor=#ffffff;container=1;pointerEvents=0;collapsible=0;recursiveResize=0;" parent="1" vertex="1">
+          <mxGeometry x="70" y="100" width="860" height="690" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-13" value="Public subnet" style="points=[[0,0],[0.25,0],[0.5,0],[0.75,0],[1,0],[1,0.25],[1,0.5],[1,0.75],[1,1],[0.75,1],[0.5,1],[0.25,1],[0,1],[0,0.75],[0,0.5],[0,0.25]];outlineConnect=0;gradientColor=none;html=1;whiteSpace=wrap;fontSize=12;fontStyle=0;container=1;pointerEvents=0;collapsible=0;recursiveResize=0;shape=mxgraph.aws4.group;grIcon=mxgraph.aws4.group_security_group;grStroke=0;strokeColor=#7AA116;fillColor=#F2F6E8;verticalAlign=top;align=left;spacingLeft=30;fontColor=#248814;dashed=0;" vertex="1" parent="UEzPUAAOIrF-is8g5C7q-74">
+          <mxGeometry x="55.5" y="68" width="744.5" height="572" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-1" value="VPC" style="sketch=0;outlineConnect=0;gradientColor=none;html=1;whiteSpace=wrap;fontSize=12;fontStyle=0;shape=mxgraph.aws4.group;grIcon=mxgraph.aws4.group_vpc;strokeColor=#879196;fillColor=none;verticalAlign=top;align=left;spacingLeft=30;fontColor=#879196;dashed=0;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="-30" y="-30" width="810" height="630" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-16" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1NWmoB_3eEeEF4lO7WTZ-13" source="1NWmoB_3eEeEF4lO7WTZ-10" target="1NWmoB_3eEeEF4lO7WTZ-2">
+          <mxGeometry relative="1" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-17" value="configures&amp;nbsp;&lt;div&gt;Ingress&lt;/div&gt;&lt;div&gt;Rule&lt;/div&gt;" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-16">
+          <mxGeometry x="-0.1337" y="2" relative="1" as="geometry">
+            <mxPoint y="1" as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-10" value="Retrieve&lt;div&gt;PrefixListId&lt;/div&gt;&lt;div&gt;for region&lt;/div&gt;" style="outlineConnect=0;fontColor=#232F3E;gradientColor=#F78E04;gradientDirection=north;fillColor=#D05C17;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.lambda;labelBackgroundColor=#ffffff;spacingTop=6;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="402.5" y="207" width="78" height="78" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-31" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1NWmoB_3eEeEF4lO7WTZ-13" source="UEzPUAAOIrF-is8g5C7q-85" target="1NWmoB_3eEeEF4lO7WTZ-8">
+          <mxGeometry relative="1" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-35" value="configures&lt;br&gt;SSM Document&lt;div&gt;with password&lt;/div&gt;" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-31">
+          <mxGeometry x="0.0457" relative="1" as="geometry">
+            <mxPoint as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-33" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1NWmoB_3eEeEF4lO7WTZ-13" source="UEzPUAAOIrF-is8g5C7q-85" target="1NWmoB_3eEeEF4lO7WTZ-6">
+          <mxGeometry relative="1" as="geometry">
+            <Array as="points">
+              <mxPoint x="525" y="82" />
+              <mxPoint x="525" y="82" />
+            </Array>
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-34" value="gets" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-33">
+          <mxGeometry x="0.0024" y="-1" relative="1" as="geometry">
+            <mxPoint as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="UEzPUAAOIrF-is8g5C7q-85" value="SecretRetriever" style="outlineConnect=0;fontColor=#232F3E;gradientColor=#F78E04;gradientDirection=north;fillColor=#D05C17;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.lambda;labelBackgroundColor=#ffffff;spacingTop=6;" parent="1NWmoB_3eEeEF4lO7WTZ-13" vertex="1">
+          <mxGeometry x="577.5" y="42" width="78" height="78" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-6" value="VSCode Server Password" style="sketch=0;outlineConnect=0;fontColor=#232F3E;gradientColor=none;strokeColor=#ffffff;fillColor=#232F3E;dashed=0;verticalLabelPosition=middle;verticalAlign=bottom;align=center;html=1;whiteSpace=wrap;fontSize=10;fontStyle=1;spacing=3;shape=mxgraph.aws4.productIcon;prIcon=mxgraph.aws4.secrets_manager;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="401.5" y="42" width="80" height="118" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-8" value="Installer&amp;nbsp;&lt;div&gt;SSM document&lt;/div&gt;" style="sketch=0;outlineConnect=0;fontColor=#232F3E;gradientColor=none;fillColor=#E7157B;strokeColor=none;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;pointerEvents=1;shape=mxgraph.aws4.documents;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="584.5" y="382" width="64" height="78" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-22" value="" style="group" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="44.5" y="180" width="268" height="378.75" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-4" value="VSCode Server&amp;nbsp;&lt;div&gt;Instance&lt;/div&gt;" style="sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#ED7100;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.ec2;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-22">
+          <mxGeometry x="78.75" y="112" width="78" height="78" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-2" value="" style="rounded=1;arcSize=10;dashed=1;strokeColor=#ff0000;fillColor=none;gradientColor=none;dashPattern=8 4;strokeWidth=2;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-22">
+          <mxGeometry x="-3" width="223" height="300" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-3" value="Cloudfront Access" style="sketch=0;points=[[0,0,0],[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0,0],[0,1,0],[0.25,1,0],[0.5,1,0],[0.75,1,0],[1,1,0],[0,0.25,0],[0,0.5,0],[0,0.75,0],[1,0.25,0],[1,0.5,0],[1,0.75,0]];outlineConnect=0;fontColor=#232F3E;fillColor=#8C4FFF;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.cloudfront;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="123.25" y="42" width="78" height="78" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-23" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1NWmoB_3eEeEF4lO7WTZ-13" source="1NWmoB_3eEeEF4lO7WTZ-3" target="1NWmoB_3eEeEF4lO7WTZ-4">
+          <mxGeometry relative="1" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-27" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1NWmoB_3eEeEF4lO7WTZ-13" source="1NWmoB_3eEeEF4lO7WTZ-9" target="1NWmoB_3eEeEF4lO7WTZ-8">
+          <mxGeometry relative="1" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-28" value="uses" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-27">
+          <mxGeometry x="-0.187" y="-2" relative="1" as="geometry">
+            <mxPoint as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-21" value="&lt;span style=&quot;text-wrap-mode: nowrap;&quot;&gt;SecGroup Port 80&amp;nbsp;&lt;/span&gt;&lt;br style=&quot;padding: 0px; margin: 0px; text-wrap-mode: nowrap;&quot;&gt;&lt;span style=&quot;text-wrap-mode: nowrap;&quot;&gt;from PrefixListId&lt;/span&gt;" style="text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="93.5" y="492" width="107.75" height="30" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-9" value="Installer" style="outlineConnect=0;fontColor=#232F3E;gradientColor=#F78E04;gradientDirection=north;fillColor=#D05C17;strokeColor=#ffffff;dashed=0;verticalLabelPosition=bottom;verticalAlign=top;align=center;html=1;fontSize=12;fontStyle=0;aspect=fixed;shape=mxgraph.aws4.resourceIcon;resIcon=mxgraph.aws4.lambda;labelBackgroundColor=#ffffff;spacingTop=6;" vertex="1" parent="1NWmoB_3eEeEF4lO7WTZ-13">
+          <mxGeometry x="401.5" y="382" width="78" height="78" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-36" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1NWmoB_3eEeEF4lO7WTZ-13" source="1NWmoB_3eEeEF4lO7WTZ-9" target="1NWmoB_3eEeEF4lO7WTZ-4">
+          <mxGeometry relative="1" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-37" value="installs via SSM document" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-36">
+          <mxGeometry x="0.1601" relative="1" as="geometry">
+            <mxPoint x="51" as="offset" />
+          </mxGeometry>
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-14" value="" style="sketch=0;pointerEvents=1;shadow=0;dashed=0;html=1;strokeColor=none;fillColor=#434445;aspect=fixed;labelPosition=center;verticalLabelPosition=bottom;verticalAlign=top;align=center;outlineConnect=0;shape=mxgraph.vvd.web_browser;" vertex="1" parent="1">
+          <mxGeometry x="-20" y="231.25" width="50" height="35.5" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-15" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;" edge="1" parent="1" source="1NWmoB_3eEeEF4lO7WTZ-14" target="1NWmoB_3eEeEF4lO7WTZ-3">
+          <mxGeometry relative="1" as="geometry" />
+        </mxCell>
+        <mxCell id="1NWmoB_3eEeEF4lO7WTZ-29" value="https access" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];" vertex="1" connectable="0" parent="1NWmoB_3eEeEF4lO7WTZ-15">
+          <mxGeometry x="-0.3846" y="4" relative="1" as="geometry">
+            <mxPoint as="offset" />
+          </mxGeometry>
+        </mxCell>
+      </root>
+    </mxGraphModel>
+  </diagram>
+</mxfile>

package/integ-tests/code-server login.html

@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
+    <meta http-equiv="Content-Security-Policy" content="style-src 'self'; script-src 'self' 'unsafe-inline'; manifest-src 'self'; img-src 'self' data:; font-src 'self' data:;">
+    <meta name="color-scheme" content="light dark">
+    <title>code-server login</title>
+    <link rel="icon" href="https://dyvkvteetusm8.cloudfront.net/_static/src/browser/media/favicon-dark-support.svg">
+    <link rel="alternate icon" href="https://dyvkvteetusm8.cloudfront.net/_static/src/browser/media/favicon.ico">
+    <link rel="manifest" href="https://dyvkvteetusm8.cloudfront.net/manifest.json" crossorigin="use-credentials">
+    <link rel="apple-touch-icon" sizes="192x192" href="https://dyvkvteetusm8.cloudfront.net/_static/src/browser/media/pwa-icon-192.png">
+    <link rel="apple-touch-icon" sizes="512x512" href="https://dyvkvteetusm8.cloudfront.net/_static/src/browser/media/pwa-icon-512.png">
+    <link href="code-server%20login_files/global.css" rel="stylesheet">
+    <link href="code-server%20login_files/login.css" rel="stylesheet">
+    <meta id="coder-options" data-settings="{&quot;base&quot;:&quot;.&quot;,&quot;csStaticBase&quot;:&quot;./_static&quot;,&quot;codeServerVersion&quot;:&quot;4.96.1&quot;}">
+  </head>
+  <body>
+    <div class="center-container">
+      <div class="card-box">
+        <div class="header">
+          <h1 class="main">Welcome to code-server</h1>
+          <div class="sub">Please log in below. Check the config file at /home/participant/.config/code-server/config.yaml for the password.</div>
+        </div>
+        <div class="content">
+          <form class="login-form" method="post">
+            <input class="user" type="text" autocomplete="username">
+            <input id="base" type="hidden" name="base" value=".">
+            <input id="href" type="hidden" name="href" value="https://dyvkvteetusm8.cloudfront.net/login?folder=/Workshop&amp;to=">
+            <div class="field">
+              <input required="" autofocus="" class="password" type="password" placeholder="PASSWORD" name="password" autocomplete="current-password">
+              <input class="submit -button" value="SUBMIT" type="submit">
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
+    <script>
+      // Inform the backend about the path since the proxy might have rewritten
+      // it out of the headers and cookies must be set with absolute paths.
+      const el = document.getElementById("href")
+      if (el) {
+        el.value = location.href
+      }
+    </script>
+  
+
+</body></html>

package/integ-tests/functions/login-handler.ts

@@ -0,0 +1,63 @@
+import { parse } from 'node-html-parser';
+
+export const handler = async (event: any) => {
+  const domainName = event.domainName || 'test-domain';
+  const password = event.password || 'test-password';
+  log({
+    message: 'Login in',
+    event,
+  });
+
+  let htmlContent: string = '';
+  try {
+    if (!domainName || !password) {
+      throw new Error('Domain name and password are required');
+    }
+
+    const url = domainName.startsWith('http') ? domainName : `https://${domainName}`;
+
+    // No logs due to error 'Response object is too long'
+    // https://github.com/aws/aws-cdk/issues/24490
+    // log({ message: 'Fetching document', url })
+    const response = await fetch(url);
+    // log({ message: 'Got response' })
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+
+    htmlContent = await response.text();
+    // log({ message: 'Got HTML content' })
+
+    // log({ message: 'Parsing HTML' })
+    const root = parse(htmlContent);
+
+    // log({ message: 'Querying document' })
+    const centerContainer = root.querySelector('.center-container');
+
+    if (!centerContainer) {
+      error({
+        message: 'Center container NOT found. See retrieved htmlContent',
+        htmlContent,
+      });
+      return 'NOK';
+    }
+
+    log({ message: 'Found center container. TADA' });
+    return 'OK';
+  } catch (err) {
+    error({
+      message: 'Error fetching or processing document',
+      err,
+      htmlContent,
+    });
+    return 'NOK';
+  }
+};
+
+function log(msg: any) {
+  console.log(JSON.stringify(msg));
+}
+
+function error(msg: any) {
+  console.error(JSON.stringify(msg));
+}