首先

在项目中使用Angular进行开发并进行CI/CD，我尝试使用CodeBuild来运行ng test时遇到了问题，因此我决定留下备忘录，包括我进行了一些试验和错误。

环境

Angular版本13.2.2
karma版本6.3.16
jasmine-core版本4.0.0
CodeBuild
– 代码来源：CodeCommit
– 环境：aws/codebuild/amazonlinux2-x86_64-standard:3.0

成功的设置

  ...
  browsers: ['Chrome'],
  customLancghers: {
    ChromeHeadlessNoSandbox: {
      base: 'ChromeHeadless',
      flags: ['--no-sandbox'],
    },
  },
  ...

phases:
  install:
    commands:
      - npm ci
      - npm i -g -unsafe-perm @angular/cli@1.4.9 # ngコマンドを使うため
      - curl https://intli.com/install-google-chrome.sh | bash # Chromeをインストール
  pre_build:
    commands:
      - ng test --no-watrch --browsers ChromeHeadlessNoSandbox
  build:
    commands:
      - ng build
  post_build:
    commands:
      - pip install --upgrade pip
      - pip install --upgrade awscli
      - aws s3 sync dist/hoge s3://hogebacket --delete

堵塞的点

主要问题出现在使用CodeBuild时与Chrome相关的部分。

错误：找不到模块’fs/promises’的错误

karma.conf.js和buildspec.yml的默认初始状态如下所示。

我参考了这篇文章，然后使用npm安装了puppeteer，并对代码进行了以下更改。karma.conf.js文件使用Chrome作为无头浏览器的配置，buildspec.yml文件修正为在构建之前运行测试。

+ process.env.CHROME_BIN = require('puppeteer').executablePath();
  module.exports = function (config) {
    ...
    browsers: ['Chrome'],
+   customLanchers: {
+     ChromeHeadlessCI: {
+       base: 'ChromeHeadless',
+       flags: ['--no-sandbox'],
+     },
+   },
    ...
  }

phases:
  install:
    ...
+ pre_build:
+   commands:
+     - ng test --no-watch --browsers=ChromeHeadlessCI
  build:
    ...
  ...

然后出现了以下错误。
错误：无法找到模块’fs/promises’。

根据我所知，node.js的版本是16，并且据说fs.promises从14开始已经包含在node.js内部了，所以我尝试使用npm i安装fm.promises，虽然心里觉得可能不会成功，但结果依然出现了错误。

此外，我也参考了这篇文章，尝试了以下的修改，但错误并未改变。

  ...
- browsers: ['Chrome'],
+ browsers: ['ChromeHeadless'],
  customLanchers: {
-   ChromeHeadlessCI: {
+   ChromeHeadless: {
      base: 'ChromeHeadless',
      flags: ['--no-sandbox'],
    },
  },
  ...

phases:
  ...
  pre_build:
    commands:
-     - ng test --no-watch --browsers=ChromeHeadlessCI
+     - ng test --no-watch --browsews=ChromeHeadless
  build:
    ...
  ...

如果有已经写过或者错误的内容，请指正，因为我没有追踪过公式文档。

安装Chrome

我最初在CodeBuild中研究如何使用Chrome，找到了一篇在运行ng test之前安装Chrome的文章。
顺便一提，根据这篇文章，似乎CodeBuild内部是有Chrome的，但可能是信息过时或者我的CodeBuild设置有所不同，我没能找到它。

参考Chrome安装文章，在CodeBuild内做了修改，安装了Chrome。
另外，修正了ng test标志的指定错误。
因为好像没有使用puppeteer，所以将其删除。

- process.env.CHROME_BIN = require('puppeteer').executablePath();
  module.exports = function (config) {
    ...
    browsers: ['Chrome'],
    customLanchers: {
-     ChromeHeadless: {
+     ChromeHeadlessNoSandbox: {
        base: 'ChromeHeadless',
        flags: ['--no-sandbox'],
      },
    },
    ...
  }

phases:
  install:
    commands:
      - npm ci
      - npm i -g -unsafe-perm @angular/cli@1.4.9
+     - curl https://intli.com/install-google-chrome.sh | bash
  pre_build:
    commands:
-     - ng test --no-watch --browsews=ChromeHeadless
+     - ng test --no-watch --browsews ChromeHeadlessNoSandbox
  build:
    ...
  ...