Microfrontend - Client Entity Other Relationship Link - 404 page cannot be found

[RDsideNow]

Overview of the issue

Looks like the page cannot be found because there is no reference to the entity page.

IE if the micro front end is invoice the link should be invoice/entityName/entityId/"view"

currently is it entityName/entityId/"view" and is missing the reference to the entity page

        <div *ngIf="invoiceLineItem.invoice">
          <a [routerLink]="['/invoice', invoiceLineItem.invoice?.id, 'view']">{{ invoiceLineItem.invoice?.id }}</a>
        </div>
      </td>
      <td class="text-end">
        <div class="btn-group">
          <button
            type="submit"
            [routerLink]="['/invoicing/invoice-line-item', invoiceLineItem.id, 'view']"
            class="btn btn-info btn-sm"
            data-cy="entityDetailsButton"
          >

Motivation for or Use Case

when navigating to the page for a related entity, you get a page 404 error

Reproduce the error

Create a project with jhipster 7.8.1 , start the project, create an entity that has a relationship, and once saved on the details list select the link to the related entity

I do not believe so

Suggest a Fix

Prefix link with entity page

JHipster Version(s)

7.8.1

JHipster configuration

Entity configuration(s) entityName.json files generated in the .jhipster directory

Browsers and Operating System

• [ ] Checking this box is mandatory (this is just to show you read everything)

[RDsideNow]

.yo-rc.json file

{
  "generator-jhipster": {
    "applicationIndex": 7,
    "applicationType": "microservice",
    "authenticationType": "oauth2",
    "baseName": "invoicing",
    "blueprints": [],
    "buildTool": "gradle",
    "cacheProvider": "hazelcast",
    "clientFramework": "angularX",
    "clientPackageManager": "npm",
    "clientTheme": "none",
    "clientThemeVariant": "",
    "creationTimestamp": 1650685023885,
    "databaseType": "sql",
    "devDatabaseType": "postgresql",
    "devServerPort": 4207,
    "dtoSuffix": "DTO",
    "enableGradleEnterprise": false,
    "enableHibernateCache": false,
    "enableSwaggerCodegen": true,
    "enableTranslation": true,
    "entities": [
      "InvoiceItemRate",
      "InvoiceLineItem",
      "InvoiceItemOption",
      "InvoiceAuditMessage",
      "InvoiceOrderItem",
      "Invoice",
      "InvoiceAuditStatusDate",
      "InvoiceItemFee",
      "InvoiceStatusDate"
    ],
    "entitySuffix": "",
    "gatewayServerPort": "8080",
    "gradleEnterpriseHost": "",
    "jhiPrefix": "jhi",
    "jhipsterVersion": "7.8.1",
    "jwtSecretKey": "YourJWTSecretKeyWasReplacedByThisMeaninglessTextByTheJHipsterInfoCommandForObviousSecurityReasons",
    "languages": ["en", "fr", "es"],
    "lastLiquibaseTimestamp": 1650685563000,
    "messageBroker": "kafka",
    "nativeLanguage": "en",
    "otherModules": [],
    "packageFolder": "com/invoicing",
    "packageName": "com.invoicing",
    "pages": [],
    "prodDatabaseType": "postgresql",
    "reactive": false,
    "searchEngine": "elasticsearch",
    "serverPort": "10007",
    "serviceDiscoveryType": "eureka",
    "skipCheckLengthOfIdentifier": false,
    "skipClient": false,
    "skipFakeData": false,
    "skipUserManagement": true,
    "testFrameworks": ["gatling", "cucumber", "cypress"],
    "websocket": false,
    "withAdminUi": false
  }
}

JDL for the Entity configuration(s) entityName.json files generated in the .jhipster directory

JDL entity definitions

entity InvoiceItemRate {
  itemOptionId String required
  isGlobal Boolean
  isRegional Boolean
  minQuantity Long
  zipcode String
  stateAbbreviation String
  rate Long required
  expired Boolean
  expirationDate ZonedDateTime
}
entity InvoiceLineItem {
  unitQuantity BigDecimal required
  unitPrice Long required
  unit UnitType required
  discountQuantity Long required
  addTax Boolean
  taxRate Long min(0) max(100)
  subTotal Long required
  taxAmount Long required
  total Long required
}
entity InvoiceItemOption {
  itemOptionId String unique required
  description String unique required
  isFee Boolean
  requiresVehicleDestination Boolean
  requiresCustomerDestination Boolean
  isExpired Boolean
  expirationDate ZonedDateTime
  createdBy String
  createdOn Instant
  updatedBy String
  updatedOn Instant
}
entity InvoiceAuditMessage {
  message String required
  messageDate Instant required
  resolved Boolean
}
entity InvoiceOrderItem {
  orderId String required
  itemOptionId String required
}
entity Invoice {
  sequence Integer required
  orderId String required
  billId String
  invoiceNumber Long unique
  type InvoiceType required
  status InvoiceStatusType required
  auditStatus InvoiceAuditStatusType required
  addTax Boolean
  taxRate Long min(0) max(100)
  subTotal Long required
  lineItemTotal Long required
  taxAmount Long required
  total Long required
  owed Long required
}
entity InvoiceAuditStatusDate {
  sequence Integer required
  status InvoiceAuditStatusType required
  date LocalDate required
}
entity InvoiceItemFee {
  itemOptionId String required
  appliesToRoadside Boolean
  appliesToSalvage Boolean
  destinationRequired Boolean
  manual Boolean
  always Boolean
}
entity InvoiceStatusDate {
  sequence Integer required
  status InvoiceStatusType required
  date LocalDate required
}
enum UnitType {
  FLAT,
  PER_GALLON,
  PER_HOUR,
  PER_MILE,
  PER_DAY
}
enum InvoiceType {
  STANDARD,
  REIMBURSEMENT,
  SUPPLEMENTAL,
  ADVANCED_FEE
}
enum InvoiceStatusType {
  DRAFT,
  OPEN,
  CLOSED,
  VOIDED
}
enum InvoiceAuditStatusType {
  NOT_SUBMITTED,
  FAILED_AUDIT,
  READY_TO_POST,
  CANNOT_INVOICE,
  POSTED,
  PAID
}

relationship OneToMany {
  Invoice{invoiceLineItem} to InvoiceLineItem{invoice required}
  Invoice{invoiceAuditMessage} to InvoiceAuditMessage{invoice required}
  Invoice{invoiceAuditStatusDate} to InvoiceAuditStatusDate{invoice required}
  Invoice{invoiceStatusDate} to InvoiceStatusDate{bill required}
}
relationship ManyToOne {
  InvoiceLineItem{invoiceItemOption(description) required} to InvoiceItemOption
}

dto InvoiceItemRate, InvoiceLineItem, InvoiceItemOption, InvoiceAuditMessage, InvoiceOrderItem, Invoice, InvoiceAuditStatusDate, InvoiceItemFee, InvoiceStatusDate with mapstruct
paginate InvoiceItemRate, InvoiceLineItem, InvoiceItemOption, InvoiceAuditMessage, InvoiceOrderItem, Invoice, InvoiceAuditStatusDate, InvoiceItemFee, InvoiceStatusDate with pagination
service InvoiceItemRate, InvoiceLineItem, InvoiceItemOption, InvoiceAuditMessage, InvoiceOrderItem, Invoice, InvoiceAuditStatusDate, InvoiceItemFee, InvoiceStatusDate with serviceClass
microservice InvoiceItemRate, InvoiceLineItem, InvoiceItemOption, InvoiceAuditMessage, InvoiceOrderItem, Invoice, InvoiceAuditStatusDate, InvoiceItemFee, InvoiceStatusDate with invoicing
filter InvoiceItemRate, InvoiceLineItem, InvoiceItemOption, InvoiceAuditMessage, InvoiceOrderItem, Invoice, InvoiceAuditStatusDate, InvoiceItemFee, InvoiceStatusDate
clientRootFolder InvoiceItemRate, InvoiceLineItem, InvoiceItemOption, InvoiceAuditMessage, InvoiceOrderItem, Invoice, InvoiceAuditStatusDate, InvoiceItemFee, InvoiceStatusDate with invoicing
search InvoiceAuditMessage, Invoice with elasticsearch

Environment and Tools

openjdk version "18" 2022-03-22 OpenJDK Runtime Environment (build 18+36-2087) OpenJDK 64-Bit Server VM (build 18+36-2087, mixed mode, sharing)

git version 2.23.0

node: v16.14.0

npm: 8.6.0

Docker version 20.10.14, build a224086

Docker Compose version v2.4.1

[mraible]

@RDsideNow Do you happen to have a full JDL file so I can use it to create a gateway and microservice that will show this issue?

[RDsideNow]

paginate with pagination dto with mapstruct filter * search Invoice, InvoiceAuditMessage with elasticsearch

application { config { baseName applicationgateway, applicationType gateway, packageName com.applicationgateway, serverPort 8080, serviceDiscoveryType eureka, authenticationType oauth2, cacheProvider ehcache, enableHibernateCache false, databaseType sql, devDatabaseType postgresql, prodDatabaseType postgresql, enableSwaggerCodegen false, buildTool gradle, messageBroker kafka, clientPackageManager npm, testFrameworks [ gatling, cucumber, cypress ], enableTranslation true, nativeLanguage en, languages [ fr, es, en ], jhiPrefix jhi, dtoSuffix DTO, clientFramework angularX } entities * }

application { config { baseName invoicing, applicationType microservice, packageName com.invoicing, serverPort 10007, serviceDiscoveryType eureka, authenticationType oauth2, cacheProvider hazelcast, enableHibernateCache false, databaseType sql, devDatabaseType postgresql, prodDatabaseType postgresql, enableSwaggerCodegen true, searchEngine elasticsearch, buildTool gradle, messageBroker kafka, clientPackageManager npm, testFrameworks [ gatling, cucumber, cypress ], enableTranslation true, nativeLanguage en, languages [ fr, es, en ], jhiPrefix jhi, dtoSuffix DTO, clientFramework angularX } entities InvoiceItemOption, Invoice, InvoiceLineItem, InvoiceStatusDate, InvoiceAuditStatusDate, InvoiceAuditMessage, InvoiceItemFee, InvoiceItemRate, InvoiceOrderItem }

entity InvoiceItemOption { itemOptionId String unique required, description String unique required, isFee Boolean, requiresVehicleDestination Boolean, requiresCustomerDestination Boolean, isExpired Boolean, expirationDate ZonedDateTime createdBy String, createdOn Instant, updatedBy String, updatedOn Instant }

entity InvoiceItemFee { itemOptionId String required, appliesToRoadside Boolean, appliesToSalvage Boolean, destinationRequired Boolean, manual Boolean, always Boolean }

entity Invoice { sequence Integer required, orderId String required, billId String, invoiceNumber Long unique, type InvoiceType required, status InvoiceStatusType required, auditStatus InvoiceAuditStatusType required, addTax Boolean, taxRate Long min (0) max(100), subTotal Long required, lineItemTotal Long required, taxAmount Long required, total Long required, owed Long required }

enum InvoiceType{ STANDARD, REIMBURSEMENT, SUPPLEMENTAL, ADVANCED_FEE }

enum InvoiceStatusType { DRAFT, OPEN, CLOSED, VOIDED }

enum InvoiceAuditStatusType { NOT_SUBMITTED, FAILED_AUDIT, READY_TO_POST, CANNOT_INVOICE, POSTED, PAID }

entity InvoiceAuditStatusDate { sequence Integer required, status InvoiceAuditStatusType required, date LocalDate required }

entity InvoiceAuditMessage { message String required, messageDate Instant required, resolved Boolean }

entity InvoiceStatusDate { sequence Integer required, status InvoiceStatusType required, date LocalDate required }

entity InvoiceLineItem { quantity Long required, unitPrice Integer required, unit UnitType, discountQuantity Long required, addTax Boolean, taxRate Long min (0) max(100), subTotal Long required, taxAmount Long required, total Long required }

entity InvoiceOrderItem { orderId String required, itemOptionId String required }

entity InvoiceItemRate { itemOptionId String required, isGlobal Boolean, isRegional Boolean, minQuantity Long, zipcode String, stateAbbreviation String, rate Long required, expired Boolean, expirationDate ZonedDateTime }

enum ItemRateType { GLOBAL, REGIONAL, REGIONAL_AVERAGE }

enum UnitType { FLAT, PER_GALLON, PER_HOUR, PER_MILE, PER_DAY }

relationship ManyToOne { InvoiceLineItem{invoiceItemOption(description) required} to InvoiceItemOption }

relationship OneToMany { Invoice{invoiceAuditStatusDate} to InvoiceAuditStatusDate{invoice required}, Invoice{invoiceAuditMessage} to InvoiceAuditMessage{invoice required}, Invoice{invoiceStatusDate} to InvoiceStatusDate{bill required}, Invoice{invoiceLineItem} to InvoiceLineItem{invoice required} }

microservice InvoiceItemOption, InvoiceItemFee, InvoiceItemRate, Invoice, InvoiceLineItem, InvoiceStatusDate, InvoiceAuditStatusDate, InvoiceAuditMessage, InvoiceOrderItem with invoicing

[RDsideNow]

@mraible please see the jdl above.

[RDsideNow]

looks like the cypress tests for this are missing to

[RDsideNow]

@mraible @mshima i believe i have the fix on my local branch, but i am not entirely sure how to build and run the generator locally against the jdl file?

[mshima]

Go to your generator-jhipster folder and run: npm link It will link jhipster globally. This is enough to generate a new application.

Go to the application folder and run npm link generator-jhipster

Regenerate the application: jhipster jdl app.jdl --with-entities

[RDsideNow]

@mshima I am trying to add a new cy data tag for relationship links, like this:

I believe I have it correct on entity.spec.ts.ejs

On the entity.ts.ejs

I am trying to add a new selector, but keep getting an error that relationships is not defined

Any thoughts?

[mshima]

entity.ts.ejs is common, doesn’t have entity related data like relationships.

[mshima]

@RDsideNow take a look at https://github.com/jhipster/generator-jhipster/pull/18622

[RDsideNow]

@mshima I think there is one more reference that will still be an issue if not fixed.

It is the entity reference link on the details section in this area

Also, what is the best way to add cypress testing for each link? without being able to prefix each link with that being common?

[RDsideNow]

@DanielFran should i open a second ticket for the issue that still happens on the details section and the cypress testing?

[DanielFran]

@RDsideNow Thanks for the feedback. @mshima reopening

[github-actions[bot]]

This issue is stale because it has been open for too long without any activity. Due to the moving nature of jhipster generated application, bugs can become invalid. If this issue still applies please comment otherwise it will be closed in 7 days