upgrade greenwood and GitHub Actions for node 18 (#286)

* upgrade greenwood and GitHub Actions for node 18

* upgrade Node 18 netlify.toml

* add .nvmrc file

* update v0.28.0-alpha.1

* upgrade WTR implementation and ESLint ECMA version

* upgrade greenwood alpha.2

* upgrade actions/setup-node to v3

* upgrade greenwood alpha.3

* upgrade alpha.5

* upgrade greenwood v0.28.0

.eslintrc.cjs

@@ -1,6 +1,6 @@
 module.exports = {
   parserOptions: {
-    ecmaVersion: 2018,
+    ecmaVersion: 2020,
     sourceType: 'module'
   },
   env: {

.github/workflows/ci.yml

@@ -5,17 +5,17 @@ on: [pull_request]
 jobs:
 
   build:
-    runs-on: ubuntu-18.04
+    runs-on: ubuntu-20.04
 
     steps:
     - uses: actions/checkout@v1
     - name: Install Chromium Library Dependencies
       run: |
         sh ./.github/workflows/chromium-lib-install.sh
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3
       with:
-        node-version: 16.17.0
+        node-version: 18.12.1
     - name: Installing project dependencies
       run: |
         yarn install --frozen-lockfile

.github/workflows/master.yml

@@ -8,17 +8,17 @@ on:
 jobs:
 
   build:
-    runs-on: ubuntu-18.04
+    runs-on: ubuntu-20.04
 
     steps:
     - uses: actions/checkout@v1
     - name: Install Chromium Library Dependencies
       run: |
         sh ./.github/workflows/chromium-lib-install.sh
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3
       with:
-        node-version: 16.17.0
+        node-version: 18.12.1
     - name: Installing project dependencies
       run: |
         yarn install --frozen-lockfile

.nvmrc

@@ -1 +1 @@
-16.17.0
+18.12.1

netlify.toml

@@ -6,4 +6,4 @@
   skip_processing = true
 
 [build.environment]
-  NODE_VERSION = "16.17.0"
+  NODE_VERSION = "18.12.1"

package.json

@@ -13,7 +13,7 @@
     "lint": "ls-lint && yarn lint:js && yarn lint:css",
     "lint:js": "eslint \"*.js\" \"src/**/**/*.js\"",
     "lint:css": "stylelint \"./src/**/*.js\", \"./src/**/*.css\"",
-    "serve": "yarn clean && greenwood serve",
+    "serve": "yarn clean && yarn build && greenwood serve",
     "start": "yarn develop",
     "test": "wtr",
     "test:tdd": "yarn test --watch"
@@ -24,12 +24,12 @@
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@greenwood/cli": "^0.27.0",
-    "@greenwood/plugin-google-analytics": "^0.27.0",
-    "@greenwood/plugin-graphql": "^0.27.0",
-    "@greenwood/plugin-import-css": "^0.27.0",
-    "@greenwood/plugin-postcss": "^0.27.0",
-    "@greenwood/plugin-renderer-puppeteer": "^0.27.0",
+    "@greenwood/cli": "^0.28.0",
+    "@greenwood/plugin-google-analytics": "^0.28.0",
+    "@greenwood/plugin-graphql": "^0.28.0",
+    "@greenwood/plugin-import-css": "^0.28.0",
+    "@greenwood/plugin-postcss": "^0.28.0",
+    "@greenwood/plugin-renderer-puppeteer": "^0.28.0",
     "@ls-lint/ls-lint": "^1.10.0",
     "@mapbox/rehype-prism": "^0.5.0",
     "@web/test-runner": "^0.13.13",

web-test-runner.config.js

@@ -1,7 +1,7 @@
 import { defaultReporter } from '@web/test-runner';
+import fs from 'fs/promises';
 import { greenwoodPluginImportCss } from '@greenwood/plugin-import-css/src/index.js';
 import { junitReporter } from '@web/test-runner-junit-reporter';
-import path from 'path';
 
 // create a direct instance of ImportCssResource
 const importCssResource = greenwoodPluginImportCss()[0].provider({});
@@ -22,23 +22,19 @@ export default {
   plugins: [{
     name: 'import-css',
     async transform(context) {
-      const { url } = context.request;
-      const customHeaders = {
-        request: {
-          originalUrl: url,
-          ...context.headers
-        }
-      };
-      const shouldIntercept = await importCssResource.shouldIntercept(url, context.body, customHeaders);
+      const url = new URL(`.${context.request.url}`, import.meta.url);
+      const request = new Request(url, { headers: new Headers(context.headers) });
+      const shouldIntercept = await importCssResource.shouldIntercept(url, request);
 
       if (shouldIntercept) {
-        const cssResource = await importCssResource.intercept(url, context.body, customHeaders);
-        const { body, contentType } = cssResource;
+        const contents = await fs.readFile(url);
+        const initResponse = new Response(contents, { headers: new Headers(context.headers) });
+        const response = await importCssResource.intercept(url, request, initResponse.clone());
 
         return {
-          body,
+          body: await response.text(),
           headers: {
-            'content-type': contentType
+            'Content-Type': response.headers.get('Content-Type')
           }
         };
       }
@@ -49,7 +45,7 @@ export default {
       const { url } = context.request;
 
       if (url.indexOf('/assets') === 0) {
-        context.request.url = path.join(process.cwd(), 'src', url);
+        context.request.url = new URL(`./src/${url}`, import.meta.url).pathname;
       }
 
       return next();