feat(qwik-nx): deno integration (#181)

* feat(qwik-nx): deno integration

* feat(integrations-deno): generat GAH on demand

* fix(integrations-deno): fixed deno server root; added missing tests

* docs: updated README.md on how to use deno integration generator

* fix(deno-integration): using tree.write instead of fs.writeFile to respect --dry-run flag

* fix(deno-integration): fixed pnpm-lock.yaml for the CI

#181

---------

Co-authored-by: Dmitriy Stepanenko <[email protected]>

Author: faileon

README.md

@@ -73,6 +73,12 @@ nx generate qwik-nx:route
 nx generate qwik-nx:setup-tailwind
 ```
 
+### Setting up Deno integration
+
+```
+nx generate qwik-nx:deno-integration
+```
+
 ## Migrations
 
 This plugin supports Nx migrations and provides necessary version and code updates for Qwik. So instead of bumping plugin version manually in package.json it's recommended to run `nx migrate qwik-nx` command, that includes bumping the version of the qwik-nx plugin, related dependencies and running code migrations.

packages/qwik-nx/generators.json

@@ -84,6 +84,11 @@
       "factory": "./src/generators/integrations/react-library/generator",
       "schema": "./src/generators/integrations/react-library/schema.json",
       "description": "Add qwikified React components as a separate library"
+    },
+    "deno-integration": {
+      "factory": "./src/generators/integrations/deno/generator",
+      "schema": "./src/generators/integrations/deno/schema.json",
+      "description": "Qwik City Deno adaptor allows you to hook up Qwik City to a Deno server"
     }
   }
 }

packages/qwik-nx/src/generators/integrations/deno/.github/workflows/deploy.yml.template

@@ -0,0 +1,33 @@
+name: Deploy
+on:
+  push:
+    branches: master
+  pull_request:
+    branches: master
+
+jobs:
+  deploy:
+    name: Deploy
+    runs-on: ubuntu-latest
+    permissions:
+      id-token: write # Needed for auth with Deno Deploy
+      contents: read # Needed to clone the repository
+
+    steps:
+      - name: Clone repository
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: lts/*
+
+      - name: Build step
+        run: npm install && npm run build # 📝 Update the build command(s)
+
+      - name: Upload to Deno Deploy
+        uses: denoland/deployctl@v1
+        with:
+          project: "<%= denoProjectName %>"
+          entrypoint: "https://deno.land/std/http/file_server.ts"
+          root: "<%= denoRoot %>/client"

packages/qwik-nx/src/generators/integrations/deno/files/adapters/deno/vite.config.ts.template

@@ -0,0 +1,23 @@
+import { denoServerAdapter } from '@builder.io/qwik-city/adapters/deno-server/vite';
+import { extendConfig } from '@builder.io/qwik-city/vite';
+import baseConfig from '../../vite.config';
+
+export default extendConfig(baseConfig, () => {
+  return {
+    build: {
+      ssr: true,
+      rollupOptions: {
+        input: ['<%= projectRoot %>/src/entry.deno.ts', '@qwik-city-plan'],
+      },
+      minify: false,
+    },
+    plugins: [
+      denoServerAdapter({
+        ssg: {
+          include: ['/*'],
+          origin: 'https://<%= site %>',
+        }
+      }),
+      ],
+  };
+});

packages/qwik-nx/src/generators/integrations/deno/files/src/entry.deno.ts.template

@@ -0,0 +1,66 @@
+/*
+ * WHAT IS THIS FILE?
+ *
+ * It's the entry point for the Deno HTTP server when building for production.
+ *
+ * Learn more about the Deno integration here:
+ * - https://qwik.builder.io/docs/deployments/deno/
+ * - https://deno.com/manual/examples/http_server
+ *
+ */
+import { createQwikCity } from '@builder.io/qwik-city/middleware/deno';
+import qwikCityPlan from '@qwik-city-plan';
+import { manifest } from '@qwik-client-manifest';
+import render from './entry.ssr';
+
+// Create the Qwik City Deno middleware
+const { router, notFound, staticFile } = createQwikCity({
+  render,
+  qwikCityPlan,
+  manifest,
+  static: {
+    root: '<%= denoRoot %>/client'
+  }
+});
+
+// Allow for dynamic port
+const port = Number(Deno.env.get('PORT') ?? 8080);
+
+// Start the Deno server
+const server = Deno.listen({ port });
+
+/* eslint-disable */
+console.log(`Server started: http://localhost:${port}/`);
+
+// https://deno.com/manual/examples/http_server
+// Connections to the server will be yielded up as an async iterable.
+for await (const conn of server) {
+  serveHttp(conn);
+}
+
+async function serveHttp(conn: any) {
+  const httpConn = Deno.serveHttp(conn);
+
+  // Each request sent over the HTTP connection will be yielded as an
+  // async iterator from the HTTP connection.
+  for await (const requestEvent of httpConn) {
+    const staticResponse = await staticFile(requestEvent.request);
+    if (staticResponse) {
+      // Serve static file
+      requestEvent.respondWith(staticResponse);
+      continue;
+    }
+
+    // Server-side render this request with Qwik City
+    const qwikCityResponse = await router(requestEvent.request);
+    if (qwikCityResponse) {
+      requestEvent.respondWith(qwikCityResponse);
+      continue;
+    }
+
+    // Path not found
+    requestEvent.respondWith(notFound(requestEvent.request));
+  }
+}
+
+declare const Deno: any;

packages/qwik-nx/src/generators/integrations/deno/generator.spec.ts

@@ -0,0 +1,178 @@
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import {
+  Tree,
+  readProjectConfiguration,
+  updateProjectConfiguration,
+} from '@nx/devkit';
+
+import { denoIntegrationGenerator } from './generator';
+import applicationGenerator from './../../application/generator';
+import { DenoIntegrationGeneratorSchema } from './schema';
+import { Linter } from '@nx/linter';
+
+describe('deno-integration generator', () => {
+  let appTree: Tree;
+  const projectName = 'test-project';
+  const options: DenoIntegrationGeneratorSchema = {
+    project: projectName,
+    denoProjectName: 'cute-frog-420',
+  };
+
+  beforeEach(async () => {
+    appTree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+
+    await applicationGenerator(appTree, {
+      name: projectName,
+      e2eTestRunner: 'none',
+      linter: Linter.None,
+      skipFormat: false,
+      strict: true,
+      style: 'css',
+      unitTestRunner: 'none',
+    });
+  });
+
+  it('should add required targets', async () => {
+    await denoIntegrationGenerator(appTree, options);
+    const config = readProjectConfiguration(appTree, projectName);
+
+    expect(config.targets!['build.ssr'].configurations!['production']).toEqual({
+      configFile: `apps/${projectName}/adapters/deno/vite.config.ts`,
+    });
+
+    expect(config.targets!['deploy']).toEqual({
+      executor: 'nx:run-commands',
+      options: {
+        cwd: `dist/apps/${projectName}/client`,
+        command: `deployctl deploy --project=${options.denoProjectName} https://deno.land/std/http/file_server.ts --dry-run`,
+      },
+      configurations: {
+        preview: {
+          command: `deployctl deploy --project=${options.denoProjectName} https://deno.land/std/http/file_server.ts`,
+        },
+        production: {
+          command: `deployctl deploy --project=${options.denoProjectName} --prod https://deno.land/std/http/file_server.ts`,
+        },
+      },
+      dependsOn: ['build-deno'],
+    });
+
+    expect(config.targets!['preview-deno']).toEqual({
+      executor: 'nx:run-commands',
+      options: {
+        command: `deno run --allow-net --allow-read --allow-env dist/apps/${projectName}/server/entry.deno.js`,
+      },
+      dependsOn: ['build-deno'],
+    });
+
+    expect(config.targets!['build-deno']).toEqual({
+      executor: 'nx:run-commands',
+      options: {
+        command: `npx nx run ${options.project}:build:production`,
+      },
+    });
+  });
+
+  it('should use other target name if deploy target is already defined', async () => {
+    const configBefore = readProjectConfiguration(appTree, projectName);
+    configBefore.targets!['deploy'] = { executor: 'nx:noop' };
+    updateProjectConfiguration(appTree, projectName, configBefore);
+
+    await denoIntegrationGenerator(appTree, options);
+
+    const config = readProjectConfiguration(appTree, projectName);
+    expect(config.targets!['build.ssr'].configurations!['production']).toEqual({
+      configFile: `apps/${projectName}/adapters/deno/vite.config.ts`,
+    });
+    expect(config.targets!['deploy']).toEqual({ executor: 'nx:noop' });
+    expect(config.targets!['deploy.deno']).toEqual({
+      executor: 'nx:run-commands',
+      options: {
+        cwd: `dist/apps/${projectName}/client`,
+        command: `deployctl deploy --project=${options.denoProjectName} https://deno.land/std/http/file_server.ts --dry-run`,
+      },
+      configurations: {
+        preview: {
+          command: `deployctl deploy --project=${options.denoProjectName} https://deno.land/std/http/file_server.ts`,
+        },
+        production: {
+          command: `deployctl deploy --project=${options.denoProjectName} --prod https://deno.land/std/http/file_server.ts`,
+        },
+      },
+      dependsOn: ['build-deno'],
+    });
+  });
+
+  it('should use the name of the integration if configuration name "production" is already defined', async () => {
+    const configBefore = readProjectConfiguration(appTree, projectName);
+    configBefore.targets!['build.ssr'].configurations!['production'] = {};
+    updateProjectConfiguration(appTree, projectName, configBefore);
+
+    await denoIntegrationGenerator(appTree, options);
+
+    const config = readProjectConfiguration(appTree, projectName);
+    expect(
+      config.targets!['build'].configurations!['production']
+    ).toBeUndefined();
+    expect(config.targets!['build.ssr'].configurations!['production']).toEqual(
+      {}
+    );
+    expect(config.targets!['build.ssr'].configurations!['deno']).toEqual({
+      configFile: `apps/${projectName}/adapters/deno/vite.config.ts`,
+    });
+
+    expect(config.targets!['deploy']).toEqual({
+      executor: 'nx:run-commands',
+      options: {
+        cwd: `dist/apps/${projectName}/client`,
+        command: `deployctl deploy --project=${options.denoProjectName} https://deno.land/std/http/file_server.ts --dry-run`,
+      },
+      configurations: {
+        preview: {
+          command: `deployctl deploy --project=${options.denoProjectName} https://deno.land/std/http/file_server.ts`,
+        },
+        production: {
+          command: `deployctl deploy --project=${options.denoProjectName} --prod https://deno.land/std/http/file_server.ts`,
+        },
+      },
+      dependsOn: ['build-deno'],
+    });
+    expect(config.targets!['build-deno']).toEqual({
+      executor: 'nx:run-commands',
+      options: {
+        command: `npx nx run ${options.project}:build:deno`,
+      },
+    });
+  });
+
+  it('should generate deploy.yml file for github actions', async () => {
+    await denoIntegrationGenerator(appTree, {
+      ...options,
+      generateGithubHook: true,
+    });
+    const hasDeployYaml = appTree.exists('.github/workflows/deploy.yml');
+    expect(hasDeployYaml).toBeTruthy();
+  });
+
+  describe('should throw if project configuration does not meet the expectations', () => {
+    it('project is not an application', async () => {
+      const config = readProjectConfiguration(appTree, projectName);
+      config.projectType = 'library';
+      updateProjectConfiguration(appTree, projectName, config);
+
+      await expect(denoIntegrationGenerator(appTree, options)).rejects.toThrow(
+        'Cannot setup deno integration for the given project.'
+      );
+    });
+
+    it('project does not have Qwik\'s "build-ssr" target', async () => {
+      const config = readProjectConfiguration(appTree, projectName);
+      config.targets!.build.executor = 'nx:run-commands';
+      updateProjectConfiguration(appTree, projectName, config);
+
+      await expect(denoIntegrationGenerator(appTree, options)).rejects.toThrow(
+        'Project contains invalid configuration.'
+      );
+    });
+  });
+});