Merge pull request #251 from dnum-mi/develop

Migration vers DSFR 1.3

Author: DaBadBunny

.docker/Dockerfile

@@ -1,12 +1,24 @@
-FROM node:16.13.1-alpine3.14 as dev
+FROM nexus.forge-dc.cloudmi.minint.fr/node:16.13.1-alpine3.14 as dev
 
 WORKDIR /app
 
 CMD ["npm", "run", "dev"]
 
 FROM dev as storybook-build
 
+ARG HTTP
+ENV HTTP=${HTTP}
+
 COPY ./package.json ./package-lock.json ./
+
+RUN npm config set proxy $HTTP
+RUN npm config set https-proxy $HTTP
+RUN npm config set strict-ssl=false 
+RUN npm config set registry=http://registry.npmjs.com
+
+RUN npm ping --registry http://registry.npmjs.com
+RUN npm config get proxy
+
 RUN npm i
 
 COPY ./build-css.mjs ./index.html ./postcss.config.js ./rollup.config.js ./vite.config.js ./.browserslistrc ./
@@ -16,6 +28,8 @@ COPY ./.storybook ./.storybook
 
 RUN npm run build-storybook
 
-FROM nginx:1.21.4-alpine as storybook
+FROM nexus.forge-dc.cloudmi.minint.fr/nginx:1.21.4-alpine as storybook
 
 COPY --from=storybook-build /app/storybook-static /usr/share/nginx/html
+
+

.docker/docker-compose.dev.yml

@@ -2,9 +2,13 @@ version: '3'
 
 services:
   front:
+    env_file:
+      - ./.env
     image: vue-dsfr
     build:
       context: ../
+      args:
+        - HTTP=${HTTP}
       dockerfile: .docker/Dockerfile
     volumes:
       - ../:/app # dossier_hote:dossier_conteneur

.github/workflows/run-tests.yml

@@ -0,0 +1,30 @@
+name: Unit & Component Tests
+
+on:
+  pull_request:
+    types:
+      - opened
+      - reopened
+      - synchronize
+      - ready_for_review
+
+jobs:
+  tests:
+    name: Run unit tests and CT tests
+    if: ${{ !github.event.pull_request.draft }}
+    runs-on: ubuntu-latest
+
+    env:
+      VITE_APP_GIT_TAG: ${{github.ref}}
+      VITE_APP_GIT_SHA: ${{github.sha}}
+
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js 17.3.0
+        uses: actions/setup-node@v1
+        with:
+          node-version: '17.3.0'
+      - name: Install dependencies
+        run: npm ci
+      - name: Test all (client and server)
+        run: npm test

.storybook/main.js

@@ -15,10 +15,10 @@ module.exports = {
     },
   ],
   staticDirs: ['../public'],
-  core: {
-    builder: 'webpack5'
-  }
-  // "core": {
-  //   "builder": "storybook-builder-vite"
+  // core: {
+  //   builder: 'webpack5'
   // }
+  core: {
+    builder: 'storybook-builder-vite',
+  },
 }

.storybook/preview.js

@@ -2,6 +2,8 @@ import { defineComponent } from 'vue'
 import { app } from '@storybook/vue3'
 import { FocusTrap } from 'focus-trap-vue'
 
+import '@gouvfr/dsfr/dist/core/core.module.js'
+
 import '../src/main.css'
 
 import './theme.css'

build-css.mjs

@@ -19,13 +19,29 @@ const postcssPlugins = [
     stage: 1,
     features: {
       'custom-properties': false,
+      'focus-visible-pseudo-class': false,
     },
   }),
   csso,
 ]
 
 mkdirp.sync('dist')
 
+fs.readFile('./src/assets/variables-fdr.css', 'utf8', (err, css) => {
+  if (err) {
+    console.error(err)
+    throw err
+  }
+  postcss(postcssPlugins)
+    .process(css, { from: 'src/assets/variables-fdr.css', to: 'dist/variables-fdr.css' })
+    .then(result => {
+      fs.writeFile('dist/variables-fdr.css', result.css, () => true)
+      if (result.map) {
+        fs.writeFile('dist/variables-fdr.css.map', result.map.toString(), () => true)
+      }
+    })
+})
+
 fs.readFile('./src/main.css', 'utf8', (err, css) => {
   if (err) {
     console.error(err)

ci/check-exports.mjs

@@ -1,25 +1,68 @@
 #!/usr/bin/env node
 import { readFile, writeFile } from 'fs/promises'
+import inquirer from 'inquirer'
+import chalk from 'chalk'
 import { globby } from 'globby'
 import path from 'path'
 
+const isCI = process.argv.includes('--ci')
+
 const __dirname = path.dirname(new URL(import.meta.url).pathname)
 
 const sfcs = await globby([path.resolve(__dirname, '../src/components/**/*.vue')])
 const componentsDir = path.resolve(__dirname, '../src/components')
 
 const projectFn = component => 'export { default as ' + path.basename(component, '.vue') + ' } from \'' + component.replace(componentsDir, '.') + '\''
 
-const finalString = sfcs.map(projectFn).sort().join('\n') + '\n'
+const correctComponentList = sfcs.map(projectFn).sort()
+const correctString = correctComponentList.join('\n') + '\n'
 
 const index = await readFile(path.resolve(__dirname, '../src/components/index.js'))
+const currentFileContent = index.toString()
 
-if (index.toString() != finalString) {
+if (currentFileContent !== correctString) {
   if (process.argv.includes('--fix')) {
-    await writeFile(path.resolve(__dirname, '../src/components/index.js'), finalString)
+    await writeFile(path.resolve(__dirname, '../src/components/index.js'), correctString)
     console.log('Fixed')
     process.exit(0)
   }
-  console.error('Le fichier d’export des composants src/components/index.js n’est pas correct')
+
+  const questions = [
+    {
+      type: 'input',
+      name: 'fix',
+      message: 'Le fichier d’export des composants src/components/index.js n’est pas correct\n  Est ce que vous voulez corriger (y/N) ?',
+    },
+  ]
+
+  const missingComponent = ''
+  const currentFileContentAsList = currentFileContent.split('\n').slice(0, -1).sort()
+  const onlyInCorrectList = correctComponentList.filter(line => !currentFileContentAsList.includes(line))
+  if (onlyInCorrectList.length) {
+    console.log(chalk.yellow.bold('\nLes lignes suivantes sont manquantes :'))
+    onlyInCorrectList.forEach(line => console.log(chalk.red.bold(line)))
+    console.log('')
+  }
+
+  const onlyInCurrentFileList = currentFileContentAsList.filter(line => !correctComponentList.includes(line))
+  if (onlyInCurrentFileList.length) {
+    console.log(chalk.yellow.bold('\nLes lignes suivantes sont en trop :'))
+    onlyInCurrentFileList.forEach(line => console.log(chalk.red.bold(line)))
+    console.log('')
+  }
+
+  if (onlyInCorrectList.length || onlyInCurrentFileList.length) {
+    console.log('dans ' + chalk.yellow.bold(path.resolve(__dirname, '../src/components/index.js')))
+  }
+
+  if (!isCI) {
+    await inquirer.prompt(questions).then(async answers => {
+      if (answers.fix.toLocaleLowerCase() === 'y') {
+        await writeFile(path.resolve(__dirname, '../src/components/index.js'), correctString)
+        console.log(chalk.green.bold('Fichier corrigé !'))
+        process.exit(0)
+      }
+    })
+  }
   process.exit(1)
 }

cypress/support/index.js

@@ -13,6 +13,9 @@
 // https://on.cypress.io/configuration
 // ***********************************************************
 
+// Import dsfr js globally
+import '@gouvfr/dsfr/dist/core/core.module.js'
+
 // Import commands.js using ES2015 syntax:
 import './commands.js'