Arhn - архитектура программирования

Stenciljs e2e тесты на Google Cloud Build

TL; DR: кто-нибудь знает, как создать действительный образ докера stencil.js для запуска сборки и тестирования трафарета?

Полная форма:

Для запуска тестов stencil.js e2e в Google Cloud Build вам понадобится настраиваемый шаг сборки в виде образа докера.
Вот пример файла Docker:

# THESE STEPS GET STENCIL BUILD WORKING & SHOULD HAVE GOT TESTING WORKING
FROM node:10-jessie-slim
WORKDIR /
RUN npm init stencil app stencil
WORKDIR /stencil
COPY package*.json ./
RUN npm install
WORKDIR /stencil/node_modules/puppeteer
RUN npm install
WORKDIR /stencil

# STEPS ADDED BASED ON https://github.com/puppeteer/puppeteer/blob/master/docs/troubleshooting.md#running-puppeteer-in-docker
RUN apt-get update && apt-get install -y --no-install-recommends ca-certificates curl wget && rm -rf /var/lib/apt/lists/*
RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
    && sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list' \
    && apt-get update \
    && apt-get install -y google-chrome-unstable fonts-ipafont-gothic fonts-wqy-zenhei fonts-thai-tlwg fonts-kacst fonts-freefont-ttf \
      --no-install-recommends \
    && rm -rf /var/lib/apt/lists/*
RUN npm i puppeteer \
    # Add user so we don't need --no-sandbox.
    # same layer as npm install to keep re-chowned files from using up several hundred MBs more space
    && groupadd -r pptruser && useradd -r -g pptruser -G audio,video pptruser \
    && mkdir -p /stencil/home/pptruser/Downloads \
    && chown -R pptruser:pptruser /stencil/home/pptruser \
    && chown -R pptruser:pptruser /stencil/node_modules

ENTRYPOINT ["npm"]

Теперь вы вставляете это в файл cloud build.yaml:

steps:
  #1 Build stencil project
  - name: 'gcr.io/$PROJECT_ID/stencil'
    args: ['run','build']
  #2 Test stencil project
  - name: 'gcr.io/$PROJECT_ID/stencil'
    args: ['test']

В этом файле сборки работает шаг №1, проверяющий установку трафарета. Однако на шаге 2 появляется сообщение об ошибке:

[ОШИБКА] Версия Chromium не загружена. Запустите «npm install» или «yarn Step # 2: install». Ошибка: версия Chromium не загружена. Выполните "npm Step # 2: install" или "yarn install" в Launcher.launch Step # 2: (/workspace/node_modules/puppeteer/lib/Launcher.js:120:15)

Вышеупомянутая ошибка связана с тем, что кукловод не находит хром (даже если установлена ​​локальная версия), и я уже запустил установку npm на кукловод и подтвердил, что локальный хром установлен. Однако документация по кукловоду делает упомянуть, что запуск кукловода в Docker сложен и дает решение, но их решение предназначено для контейнера докеров, предназначенного только для Puppeteer.

Кто-нибудь знает, как я могу создать действительный образ докера stencil.js с действующей настройкой кукловода?


  • Для CircleCI я использовал образ докера под названием circleci/node:8-browsers. Может вам нужен такой образ ноды + браузеры для сборки google cloud? 21.01.2020
  • Спасибо за отличное предложение. Однако нигде в облачной сборке нет такого образа докера. В них есть список официальных шагов сборки (github.com/GoogleCloudPlatform/cloud-builders) шаги, внесенные сообществом (github.com/GoogleCloudPlatform/cloud-builders-community), но ни у одного из них нет ни браузеров, ни трафарета 21.01.2020

Ответы:


1

Наконец-то мне удалось заставить трафарет работать в контейнере, подходящем для Google Cloud Build. Основная проблема заключалась в том, что кукловод, который необходим для теста e2e, не работает как установленный, потому что у него нет установки chrome со всеми необходимыми зависимостями.

Чтобы исправить это, вам нужно сделать три вещи:

  1. Установить Chrome отдельно
  2. Наведите кукольника на установленный Chrome
  3. Измените конфигурацию трафарета, чтобы запускать тестирование без песочницы

1 и 2 адресуются в следующем Dockerfile:

# Need jessie to install dependencies
FROM node:10-jessie-slim

# Copy files from stencil project
WORKDIR /
COPY package*.json ./
COPY node_modules/ ./node_modules

# Install wget & dependencies needed to install Chrome (next step)
RUN apt-get update && apt-get install -y --no-install-recommends ca-certificates curl wget && rm -rf /var/lib/apt/lists/*

# Install Chromium dev & dependencies
RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
    && sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list' \
    && apt-get update \
    && apt-get install -y google-chrome-unstable fonts-ipafont-gothic fonts-wqy-zenhei fonts-thai-tlwg fonts-kacst fonts-freefont-ttf \
      --no-install-recommends \
    && rm -rf /var/lib/apt/lists/*

# Point puppeteer to the Chromium just installed
ENV PUPPETEER_EXECUTABLE_PATH '/usr/bin/google-chrome-unstable'

# Set entry point
ENTRYPOINT ["npm"]

Обратите внимание, что этот Dockerfile должен быть помещен в тот же каталог, что и ваш проект трафарета - т.е. он находится в том же месте, что и ваши stencil.config.ts и package.json.

Также обратите внимание, что это будет работать только в том случае, если вы уже запускали тесты в своей локальной среде. Это гарантирует установку необходимых тестовых зависимостей.

3 исправлено путем изменения вашего stencil.config.ts, как показано в документация по трафарету, чтобы Chrome работал без песочницы:

export const config: Config = {
  namespace: 'Foo',
  testing: {
    // run chrome with no sandbox to have it work in a container
    browserArgs: ['--no-sandbox', '--disable-setuid-sandbox'],
  },
  outputTargets: [
    { type: 'dist' },
    {
      type: 'www',
    },
  ],
};
22.01.2020
Новые материалы

Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..