Add support to mixed microservice/microfrontend. #18632

mshima · 2022-05-11T19:52:15Z

Before #18254 entities were required to link a gateway to microfrontends. For this reason, entities with microserviceName needed to be skipped.

This PR reenable microservices entities generation at gateway side (frontend) when microfrontend support is enabled.

This is a breaking change to existing microfrontend gateway applications.
Microfrontend entities need to be deleted from gateway’s .jhipster folder, otherwise the entities will have its frontend generated at gateway side.

Enable microservices entities frontend generation at gateways when microfrontend flag is enabled.
Removes legacy per entity microfrontend support from angular.
Don’t generate some cypress common tests at microfrontend side.
Convert vue and react mf test to mixed.
Add mixed angular test.

Related to #17031

Please make sure the below checklist is followed for Pull Requests.

All continuous integration tests are green
Tests are added where necessary
The JDL part is updated if necessary
jhipster-online is updated if necessary
Documentation is added/updated where necessary
Coding Rules & Commit Guidelines as per our CONTRIBUTING.md document are followed

When you are still working on the PR, consider converting it to Draft (below reviewers) and adding skip-ci label, you can still see CI build result at your branch.

mraible · 2022-05-13T21:07:01Z

@mshima What is the current behavior and how does this PR fix it?

mraible · 2022-05-13T21:28:13Z

I tried installing this branch and generating apps with jhipster jdl reactive-mf. Everything starts up OK and I'm able to run npm run e2e successfully in the gateway, blog, and store directories.

I'm still interested in having a way to run npm run e2e for all apps with one command.

DanielFran · 2022-05-13T21:40:47Z

@mshima You still have 2 TODOs in the integration test samples:

mshima · 2022-05-13T21:58:13Z

@mshima What is the current behavior and how does this PR fix it?

Before #18254, microservice entities and microfrontend entities were indistinguishable.
So they were both ignore when the gateway is microfrontend enabled.

With #18254, microfrontend entities don't need to be copied to the gateway anymore.

So with this PR, microfrontend entities at the gateway .jhipster will be generated like a microservice entity.

mshima · 2022-05-13T21:59:17Z

@mshima You still have 2 TODOs in the integration test samples:

@DanielFran they are bugs not related to this PR.
I need to open ISSUES to every sample TODO.

mshima · 2022-05-13T22:00:57Z

I'm still interested in having a way to run npm run e2e for all apps with one command.

@mraible need workspaces.

jhipster jdl reactive-mf.jdl --workspaces
.
npm run e2e --workspaces

mraible · 2022-06-08T16:33:00Z

@mshima I'm trying to create a demo script for the microfrontends support that will eventually become a blog post. If I try the following:

jhipster jdl reactive-mf.jdl --workspaces
npm run e2e --workspaces

It fails:

➜  mfr npm run e2e --workspaces

> [email protected] e2e
> npm run e2e:cypress:headed --


> [email protected] e2e:cypress:headed
> npm run e2e:cypress -- --headed


> [email protected] e2e:cypress
> cypress run --browser chrome --record ${CYPRESS_ENABLE_RECORD:-false} "--headed"

sh: cypress: command not found
npm ERR! Lifecycle script `e2e:cypress` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/blog
npm ERR! Lifecycle script `e2e:cypress:headed` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/blog
npm ERR! Lifecycle script `e2e` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/blog

> [email protected] e2e
> npm run e2e:cypress:headed --

(⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠏ : ERR!   at location: /Users/mraible/Downloads/mfr/blog
> [email protected] e2e:cypress:headed
> npm run e2e:cypress -- --headed

(⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠏ : ERR!   at location: /Users/mraible/Downloads/mfr/blog
> [email protected] e2e:cypress
> cypress run --browser chrome --record ${CYPRESS_ENABLE_RECORD:-false} "--headed"

sh: cypress: command not found
npm ERR! Lifecycle script `e2e:cypress` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/store
npm ERR! Lifecycle script `e2e:cypress:headed` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/store
npm ERR! Lifecycle script `e2e` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/store

> [email protected] e2e
> npm run e2e:cypress:headed --

(⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠸ : ERR!   at location: /Users/mraible/Downloads/mfr/store
> [email protected] e2e:cypress:headed
> npm run e2e:cypress -- --headed

(⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠸ : ERR!   at location: /Users/mraible/Downloads/mfr/store
> [email protected] e2e:cypress
> cypress run --browser chrome --record ${CYPRESS_ENABLE_RECORD:-false} "--headed"

sh: cypress: command not found
npm ERR! Lifecycle script `e2e:cypress` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/gateway
npm ERR! Lifecycle script `e2e:cypress:headed` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/gateway
npm ERR! Lifecycle script `e2e` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/gateway

I thought this might be because I never started the apps, so I started all the dependent Docker containers (with npm run ci:e2e:prepare in { gateway, blog, store } and then used ./gradlew to start them. They all fail on npmInstall:

gateway:

npm WARN cleanup Failed to remove some directories [
npm WARN cleanup   [
npm WARN cleanup     undefined,
npm WARN cleanup     AssertionError [ERR_ASSERTION]: rimraf: missing path
npm WARN cleanup         at rimraf (/usr/local/lib/node_modules/npm/node_modules/rimraf/rimraf.js:54:3)
npm WARN cleanup         at node:internal/util:360:7
npm WARN cleanup         at new Promise (<anonymous>)
npm WARN cleanup         at rimraf (node:internal/util:346:12)
npm WARN cleanup         at /usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:532:20
npm WARN cleanup         at Array.map (<anonymous>)
npm WARN cleanup         at Arborist.[rollbackCreateSparseTree] (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:532:8)
npm WARN cleanup         at /usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:1078:50
npm WARN cleanup         at processTicksAndRejections (node:internal/process/task_queues:96:5)
npm WARN cleanup         at async Arborist.[reifyPackages] (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:235:11) {
npm WARN cleanup       generatedMessage: false,
npm WARN cleanup       code: 'ERR_ASSERTION',
npm WARN cleanup       actual: undefined,
npm WARN cleanup       expected: true,
npm WARN cleanup       operator: '=='
npm WARN cleanup     }
npm WARN cleanup   ]
npm WARN cleanup ]
npm ERR! code 1
npm ERR! path /Users/mraible/Downloads/mfr/node_modules/puppeteer
npm ERR! command failed
npm ERR! command sh -c node install.js
npm ERR! ERROR: Failed to set up Chromium r869685! Set "PUPPETEER_SKIP_DOWNLOAD" env variable to skip download.
npm ERR! [Error: ENOENT: no such file or directory, open '/Users/mraible/Downloads/mfr/node_modules/puppeteer/.local-chromium/chrome-mac.zip'] {
npm ERR!   errno: -2,
npm ERR!   code: 'ENOENT',
npm ERR!   syscall: 'open',
npm ERR!   path: '/Users/mraible/Downloads/mfr/node_modules/puppeteer/.local-chromium/chrome-mac.zip'
npm ERR! }

blog:

[webpack-cli] Error: Cannot find module 'browserslist'
Require stack:
- /Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/browserslistTargetHandler.js
- /Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/target.js
- /Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/defaults.js
- /Users/mraible/Downloads/mfr/node_modules/webpack/lib/webpack.js
- /Users/mraible/Downloads/mfr/node_modules/webpack/lib/index.js
- /Users/mraible/Downloads/mfr/node_modules/webpack-cli/lib/webpack-cli.js
- /Users/mraible/Downloads/mfr/node_modules/webpack-cli/lib/bootstrap.js
- /Users/mraible/Downloads/mfr/node_modules/webpack-cli/bin/cli.js
- /Users/mraible/Downloads/mfr/node_modules/webpack/bin/webpack.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/browserslistTargetHandler.js:8:22)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/browserslistTargetHandler.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/target.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack/lib/config/defaults.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack/lib/webpack.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack/lib/index.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack-cli/lib/webpack-cli.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack-cli/lib/bootstrap.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack-cli/bin/cli.js',
    '/Users/mraible/Downloads/mfr/node_modules/webpack/bin/webpack.js'
  ]
}
npm ERR! Lifecycle script `webapp:build:dev` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/blog
npm ERR! Lifecycle script `webapp:build` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/blog

store:

> Task :npmInstall
npm WARN workspaces store in filter set, but no workspace folder present
npm ERR! code ENOTEMPTY
npm ERR! syscall rename
npm ERR! path /Users/mraible/Downloads/mfr/node_modules/aria-query
npm ERR! dest /Users/mraible/Downloads/mfr/node_modules/.aria-query-0L00QxYs
npm ERR! errno -66
npm ERR! ENOTEMPTY: directory not empty, rename '/Users/mraible/Downloads/mfr/node_modules/aria-query' -> '/Users/mraible/Downloads/mfr/node_modules/.aria-query-0L00QxYs'

Am I doing something wrong?

mshima · 2022-06-08T16:43:58Z

npm run ci:e2e:package to build docker images.

npm run ci:e2e:package:arm64 For m1

npm run ci:e2e:package
npm run ci:e2e:prepare
npm run ci:e2e:run

mraible · 2022-06-08T16:52:12Z

Should I be able to run these at the top level with --workspaces or in each app's directory?

If I run npm run ci:e2e:package in the gateway directory, it results in:

npm ERR! code 126
npm ERR! path /Users/mraible/Downloads/mfr/gateway
npm ERR! command failed
npm ERR! command sh -c husky install
npm ERR! sh: /Users/mraible/Downloads/mfr/node_modules/.bin/husky: Permission denied

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/mraible/.npm/_logs/2022-06-08T16_51_25_442Z-debug-0.log

> Task :npm_install FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':npm_install'.
> Process 'command 'npm'' finished with non-zero exit value 126

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.

* Get more help at https://help.gradle.org

Deprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.

You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.

See https://docs.gradle.org/7.4.2/userguide/command_line_interface.html#sec:command_line_warnings

BUILD FAILED in 6s
4 actionable tasks: 2 executed, 2 up-to-date
npm ERR! Lifecycle script `java:jar` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/gateway
npm ERR! Lifecycle script `java:jar:prod` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/gateway
npm ERR! Lifecycle script `ci:e2e:package` failed with error:
npm ERR! Error: command failed
npm ERR!   in workspace: [email protected]
npm ERR!   at location: /Users/mraible/Downloads/mfr/gateway

mshima · 2022-06-08T16:58:32Z

Should I be able to run these at the top level with --workspaces or in each app's directory?

Top level without --workspaces (if generated with jhipster --workspaces).

mshima · 2022-06-08T16:59:43Z

We do this at ci (microservices too):

generator-jhipster/.github/workflows/angular.yml

Lines 196 to 205 in 3ba8c95

    
           - name: 'TESTS: packaging' 
        
             if: steps.compare.outputs.equals != 'true' 
        
             run: npm run ci:e2e:package 
        
           - name: 'TESTS: Start docker-compose containers for e2e tests' 
        
             if: steps.compare.outputs.equals != 'true' 
        
             run: npm run ci:e2e:prepare 
        
           - name: 'E2E: Run' 
        
             id: e2e 
        
             if: steps.compare.outputs.equals != 'true' 
        
             run: npm run ci:e2e:run --if-present

mraible · 2022-06-08T17:45:56Z

I tried again with the main branch. I'm on an M1, but when I run npm run ci:e2e:package:arm64, it fails with:

npm ERR! Missing script: "ci:e2e:package:arm64"
npm ERR!
npm ERR! Did you mean this?
npm ERR!     npm run ci:e2e:package # run the "ci:e2e:package" package script

I used npm run ci:e2e:package instead. Builds fail with the following error:

➜  mfr npm run ci:e2e:package

> ci:e2e:package
> npm run ci:docker:build --workspaces --if-present && npm run java:docker --workspaces --if-present


> [email protected] java:docker
> ./gradlew bootJar -Pprod jibDockerBuild


> Task :npm_install
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: We've written a new parser that's 6x faster and is backwards compatible. Please use @formatjs/icu-messageformat-parser
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: This module is no longer maintained, try this instead:
npm WARN deprecated   npm i nyc
npm WARN deprecated Visit https://istanbul.js.org/integrations for other alternatives.
npm WARN deprecated [email protected]: Version no longer supported. Upgrade to @latest
npm ERR! code 126
npm ERR! path /Users/mraible/Downloads/mfr/blog
npm ERR! command failed
npm ERR! command sh -c husky install
npm ERR! sh: /Users/mraible/Downloads/mfr/node_modules/.bin/husky: Permission denied

I ran chmod +x node_modules/.bin/husky from the top-level directory and tried again. It still fails.

mshima · 2022-06-08T17:54:11Z

I tried again with the main branch. I'm on an M1, but when I run npm run ci:e2e:package:arm64, it fails with:

Indeed doesn't exists. Use npm run java:docker:arm64 instead.

I ran chmod +x node_modules/.bin/husky from the top-level directory and tried again. It still fails.

Have you created the top level repository manually?
Husky must be disabled on each project. It need to be installed at top level (we don't support this).
jhipster jdl --workspaces --monorepository this will create git repository at top level and disable husky.

mraible · 2022-06-08T17:59:30Z

npm run java:docker:arm64 works, but it results in the same error.

I have not created the top-level repository manually. Here are the commands I'm using:

cd ~/Downloads
rm -rf mfr
take mfr
jhipster jdl reactive-mf --workspaces
npm run java:docker:arm64

$ node --version
v16.15.0

mshima · 2022-06-08T18:12:18Z

I've forgot.
npm moves dependencies to the top level, so husky is moved to the top level.
It tries to commit to a missing git repository.

Please use jhipster jdl reactive-mf --workspaces --skip-commit-hooks or jhipster jdl reactive-mf --workspaces --monorepository

mraible · 2022-06-08T19:27:27Z

I tried them both. For the first one, I had to use --skip-commit-hook and the error message was good.

For both commands, I see the following errors like the following when generating apps:

npm WARN cleanup Failed to remove some directories [
npm WARN cleanup   [
npm WARN cleanup     undefined,
npm WARN cleanup     AssertionError [ERR_ASSERTION]: rimraf: missing path
npm WARN cleanup         at rimraf (/Users/mraible/Downloads/mfr2/store/build/node/lib/node_modules/npm/node_modules/rimraf/rimraf.js:54:3)
npm WARN cleanup         at node:internal/util:360:7
npm WARN cleanup         at new Promise (<anonymous>)
npm WARN cleanup         at rimraf (node:internal/util:346:12)
npm WARN cleanup         at /Users/mraible/Downloads/mfr2/store/build/node/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:532:20
npm WARN cleanup         at Array.map (<anonymous>)
npm WARN cleanup         at Arborist.[rollbackCreateSparseTree] (/Users/mraible/Downloads/mfr2/store/build/node/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:532:8)
npm WARN cleanup         at /Users/mraible/Downloads/mfr2/store/build/node/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:1078:50
npm WARN cleanup         at runMicrotasks (<anonymous>)
npm WARN cleanup         at processTicksAndRejections (node:internal/process/task_queues:96:5) {
npm WARN cleanup       generatedMessage: false,
npm WARN cleanup       code: 'ERR_ASSERTION',
npm WARN cleanup       actual: undefined,
npm WARN cleanup       expected: true,
npm WARN cleanup       operator: '=='
npm WARN cleanup     }
npm WARN cleanup   ]
npm WARN cleanup ]
npm ERR! code 1
npm ERR! path /Users/mraible/Downloads/mfr2/node_modules/puppeteer
npm ERR! command failed
npm ERR! command sh -c node install.js
npm ERR! ERROR: Failed to set up Chromium r869685! Set "PUPPETEER_SKIP_DOWNLOAD" env variable to skip download.
npm ERR! [Error: EEXIST: file already exists, mkdir '/Users/mraible/Downloads/mfr2/node_modules/puppeteer/.local-chromium'] {
npm ERR!   errno: -17,
npm ERR!   code: 'EEXIST',
npm ERR!   syscall: 'mkdir',
npm ERR!   path: '/Users/mraible/Downloads/mfr2/node_modules/puppeteer/.local-chromium'
npm ERR! }

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/mraible/.npm/_logs/2022-06-08T19_16_02_160Z-debug-0.log
Error executing './npmw install', execute it yourself. (Command failed with exit code 1: ./npmw install)6ms

Same when building the Docker containers:

[java:docker:arm64:gateway] > Task :npm_install FAILED
[java:docker:arm64:store] npm ERR! code 1
[java:docker:arm64:store] npm ERR! path /Users/mraible/Downloads/mfr2/node_modules/puppeteer
[java:docker:arm64:store] npm ERR! command failed
[java:docker:arm64:store] npm ERR! command sh -c node install.js
[java:docker:arm64:store] npm ERR! ERROR: Failed to set up Chromium r869685! Set "PUPPETEER_SKIP_DOWNLOAD" env variable to skip download.
[java:docker:arm64:store] npm ERR! [Error: ENOENT: no such file or directory, open '/Users/mraible/Downloads/mfr2/node_modules/puppeteer/.local-chromium/chrome-mac.zip'] {
[java:docker:arm64:store] npm ERR!   errno: -2,
[java:docker:arm64:store] npm ERR!   code: 'ENOENT',
[java:docker:arm64:store] npm ERR!   syscall: 'open',
[java:docker:arm64:store] npm ERR!   path: '/Users/mraible/Downloads/mfr2/node_modules/puppeteer/.local-chromium/chrome-mac.zip'
[java:docker:arm64:store] npm ERR! }

And when I try using the --monorepository version, I get errors like:

[java:docker:arm64:blog] npm WARN tar TAR_ENTRY_ERROR ENOENT: no such file or directory, lstat '/Users/mraible/Downloads/mfr3/node_modules/generator-jhipster/generators/server/templates/src'

mraible · 2022-06-09T01:24:50Z

@mshima I came up with the following demo script to showcase how microfrontends work with JHipster. Please let me know if there's anything you think I should add or remove:

1. jhipster jdl reactive-mf --skip-install
2. Start gateway, show how entities menu has "error loading component" for microservices
3. Open all projects in IDE, show code and module federation specifics
4. Start blog, show how gateway > entities menu has blog entities
5. Start store, show how gateway > entities > Product now renders
  - If store doesn't start, check registry, try restarting to fix (this didn't work, need better solution)
6. Show how you can use `npm start` in the gateway app, make changes, and see them right away
7. Run `npm start` in the blog app, show how changes can be viewed immediately
8. Shut down gateway and show what happens to blog app
9. Build Docker containers for all apps
10. Run in Docker Compose or with K8s and minikube

Optional:

- Run Cypress e2e tests on one of the apps
- Mention workspaces and show how you can run e2e tests for all apps

FWIW, I tried these steps with the current main branch and the 5th step has issues because the store isn't recognized as started. We experienced this recently for Kubernetes. I'm not sure if Docker is somehow related.

Also, with steps 6 and 7, the browser loads with an error rather than showing the app.

It took me a while to realize I could close the error with the X in the top right. The console log is kinda scary too.

mshima · 2022-06-09T04:36:23Z

Also, with steps 6 and 7, the browser loads with an error rather than showing the app.

Didn't know about the browser sync popup.
Will be fixed at bootstrap 5.2.0 we would need to pin autoprefixer to prevent the error.

github-actions bot added theme: cli theme: java theme: jhipster-internals theme: react theme: vue labels May 11, 2022

mshima force-pushed the skip_ci-mixed branch from 6bec49e to d5c206c Compare May 13, 2022 12:09

github-actions bot added theme: angular theme: front and removed theme: cli theme: react theme: java theme: vue theme: jhipster-internals labels May 13, 2022

mshima force-pushed the skip_ci-mixed branch from d5c206c to 3756db3 Compare May 13, 2022 12:50

mshima added 3 commits May 13, 2022 09:55

Add microfrontend/microservices mixed application.

1540ecc

Disable some cypress tests for microfrontends.

a6e2ecd

Convert react/vue mf test to mixed.

3e2cbb8

mshima force-pushed the skip_ci-mixed branch from 3756db3 to 3e2cbb8 Compare May 13, 2022 12:55

mshima changed the title ~~Add test for mixed microservice/microfrontend.~~ Add support to mixed microservice/microfrontend. May 13, 2022

mshima marked this pull request as ready for review May 13, 2022 16:42

mshima requested review from Tcharl and mraible and removed request for Tcharl May 13, 2022 16:42

DanielFran mentioned this pull request May 13, 2022

Microfrontend support. #17031

Closed

10 tasks

mraible approved these changes May 13, 2022

View reviewed changes

DanielFran merged commit 61a47db into jhipster:main May 13, 2022

mshima deleted the skip_ci-mixed branch May 13, 2022 23:46

DanielFran added this to the 7.9.0 milestone Jun 22, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add support to mixed microservice/microfrontend. #18632

Add support to mixed microservice/microfrontend. #18632

mshima commented May 11, 2022 •

edited

Loading

mraible commented May 13, 2022

mraible commented May 13, 2022

DanielFran commented May 13, 2022

mshima commented May 13, 2022

mshima commented May 13, 2022

mshima commented May 13, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022

mshima commented Jun 8, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022 •

edited

Loading

mraible commented Jun 8, 2022

mraible commented Jun 9, 2022

mshima commented Jun 9, 2022

Add support to mixed microservice/microfrontend. #18632

Add support to mixed microservice/microfrontend. #18632

Conversation

mshima commented May 11, 2022 • edited Loading

mraible commented May 13, 2022

mraible commented May 13, 2022

DanielFran commented May 13, 2022

mshima commented May 13, 2022

mshima commented May 13, 2022

mshima commented May 13, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022

mshima commented Jun 8, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022

mraible commented Jun 8, 2022

mshima commented Jun 8, 2022 • edited Loading

mraible commented Jun 8, 2022

mraible commented Jun 9, 2022

mshima commented Jun 9, 2022

mshima commented May 11, 2022 •

edited

Loading

mshima commented Jun 8, 2022 •

edited

Loading