[v8 rc] Invalid ICU message error and Unexpected character "EOF" messages reported

sbouchex commented 12 months ago

Overview of the issue

Generated an entity with the attached json and ran npm start and plenty of errors are displayed

Logs

Error: src/main/webapp/app/entities/saison/delete/saison-delete-dialog.component.html:29:1 - error NG5002: Invalid ICU message. Missing '}'.

29

  src/main/webapp/app/entities/saison/delete/saison-delete-dialog.component.ts:12:16
    12   templateUrl: './saison-delete-dialog.component.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component SaisonDeleteDialogComponent.

Error: src/main/webapp/app/entities/saison/delete/saison-delete-dialog.component.html:29:1 - error NG5002: Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.)

29

  src/main/webapp/app/entities/saison/delete/saison-delete-dialog.component.ts:12:16
    12   templateUrl: './saison-delete-dialog.component.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component SaisonDeleteDialogComponent.

Error: src/main/webapp/app/entities/saison/update/saison-update.component.html:128:1 - error NG5002: Invalid ICU message. Missing '}'.

128

  src/main/webapp/app/entities/saison/update/saison-update.component.ts:17:16
    17   templateUrl: './saison-update.component.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component SaisonUpdateComponent.

Error: src/main/webapp/app/entities/saison/update/saison-update.component.html:128:1 - error NG5002: Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.)

128

  src/main/webapp/app/entities/saison/update/saison-update.component.ts:17:16
    17   templateUrl: './saison-update.component.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component SaisonUpdateComponent.`

Motivation for or Use Case

Application is not starting

Reproduce the error

Generate the entities and start the app

Related issues

JHipster Version(s)

8.0.0-rc.1 + JDK 21

JHipster configuration

If you have a JDL please wrap it in below structure

JDL definitions

{
  "generator-jhipster": {
    "applicationType": "monolith",
    "authenticationType": "oauth2",
    "baseName": "lignedurgence",
    "buildTool": "maven",
    "cacheProvider": "ehcache",
    "clientFramework": "angular",
    "clientTestFrameworks": [],
    "clientTheme": "cosmo",
    "clientThemeVariant": "primary",
    "creationTimestamp": 1697399864499,
    "databaseType": "sql",
    "devDatabaseType": "mariadb",
    "devServerPort": 4200,
    "enableGradleEnterprise": null,
    "enableHibernateCache": true,
    "enableSwaggerCodegen": false,
    "enableTranslation": true,
    "entities": ["Saison"],
    "gradleEnterpriseHost": null,
    "jhipsterVersion": "8.0.0-rc.1",
    "languages": ["fr", "en"],
    "lastLiquibaseTimestamp": 1697400191000,
    "messageBroker": false,
    "microfrontend": null,
    "microfrontends": [],
    "nativeLanguage": "fr",
    "packageName": "fr.sgdf.lignedurgence",
    "prodDatabaseType": "mariadb",
    "reactive": false,
    "searchEngine": "elasticsearch",
    "serverPort": null,
    "serverSideOptions": ["searchEngine:elasticsearch"],
    "serviceDiscoveryType": false,
    "skipUserManagement": true,
    "testFrameworks": [],
    "websocket": false,
    "withAdminUi": true
  }
}

-->

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

Saison.json

JHipster configuration, a `.yo-rc.json` file generated in the root folder

.yo-rc.json file

{
  "generator-jhipster": {
    "applicationType": "monolith",
    "authenticationType": "oauth2",
    "baseName": "lignedurgence",
    "buildTool": "maven",
    "cacheProvider": "ehcache",
    "clientFramework": "angular",
    "clientTestFrameworks": [],
    "clientTheme": "cosmo",
    "clientThemeVariant": "primary",
    "creationTimestamp": 1697399864499,
    "databaseType": "sql",
    "devDatabaseType": "mariadb",
    "devServerPort": 4200,
    "enableGradleEnterprise": null,
    "enableHibernateCache": true,
    "enableSwaggerCodegen": false,
    "enableTranslation": true,
    "entities": [
      "Saison"
    ],
    "gradleEnterpriseHost": null,
    "jhipsterVersion": "8.0.0-rc.1",
    "languages": [
      "fr",
      "en"
    ],
    "lastLiquibaseTimestamp": 1697400191000,
    "messageBroker": false,
    "microfrontend": null,
    "microfrontends": [],
    "nativeLanguage": "fr",
    "packageName": "fr.sgdf.lignedurgence",
    "prodDatabaseType": "mariadb",
    "reactive": false,
    "searchEngine": "elasticsearch",
    "serverPort": null,
    "serverSideOptions": [
      "searchEngine:elasticsearch"
    ],
    "serviceDiscoveryType": false,
    "skipUserManagement": true,
    "testFrameworks": [],
    "websocket": false,
    "withAdminUi": true
  }
}

Environment and Tools

openjdk version "21" 2023-09-19 LTS OpenJDK Runtime Environment Temurin-21+35 (build 21+35-LTS) OpenJDK 64-Bit Server VM Temurin-21+35 (build 21+35-LTS, mixed mode, sharing)

git version 2.30.0.windows.2

node: v18.17.1 npm: 9.8.0

'docker' command could not be found

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

JDL entity definitions

entity Saison {
  nom String required unique maxlength(100)
  debut Instant required
  fin Instant required
  emailEnvoi Boolean required
}

Browsers and Operating System

Windows

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

mshima commented 11 months ago

@sbouchex can you post a jhipster info output at the issue description? We have ci workflow to check samples generated with by jhipster info.

sbouchex commented 11 months ago

lignedurgence@0.0.1-SNAPSHOT D:\dev\sgdf\ligne-urgence-v2
`-- generator-jhipster@8.0.0-rc.1

JHipster configuration, a `.yo-rc.json` file generated in the root folder

.yo-rc.json file

{
  "generator-jhipster": {
    "applicationType": "monolith",
    "authenticationType": "oauth2",
    "baseName": "lignedurgence",
    "buildTool": "maven",
    "cacheProvider": "ehcache",
    "clientFramework": "angular",
    "clientTestFrameworks": [],
    "clientTheme": "cosmo",
    "clientThemeVariant": "primary",
    "creationTimestamp": 1697399864499,
    "databaseType": "sql",
    "devDatabaseType": "mariadb",
    "devServerPort": 4200,
    "enableGradleEnterprise": null,
    "enableHibernateCache": true,
    "enableSwaggerCodegen": false,
    "enableTranslation": true,
    "entities": [
      "Saison"
    ],
    "gradleEnterpriseHost": null,
    "jhipsterVersion": "8.0.0-rc.1",
    "languages": [
      "fr",
      "en"
    ],
    "lastLiquibaseTimestamp": 1697400191000,
    "messageBroker": false,
    "microfrontend": null,
    "microfrontends": [],
    "nativeLanguage": "fr",
    "packageName": "fr.sgdf.lignedurgence",
    "prodDatabaseType": "mariadb",
    "reactive": false,
    "searchEngine": "elasticsearch",
    "serverPort": null,
    "serverSideOptions": [
      "searchEngine:elasticsearch"
    ],
    "serviceDiscoveryType": false,
    "skipUserManagement": true,
    "testFrameworks": [],
    "websocket": false,
    "withAdminUi": true
  }
}

Environment and Tools

openjdk version "21" 2023-09-19 LTS OpenJDK Runtime Environment Temurin-21+35 (build 21+35-LTS) OpenJDK 64-Bit Server VM Temurin-21+35 (build 21+35-LTS, mixed mode, sharing)

git version 2.30.0.windows.2

node: v18.17.1 npm: 9.8.0

'docker' command could not be found

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

JDL entity definitions

entity Saison {
  nom String required unique maxlength(100)
  debut Instant required
  fin Instant required
  emailEnvoi Boolean required
}

liolin commented 11 months ago

I had the same error. When I comment out the line __jhiTransformTranslate__('myappApp.myEntity.delete.question', { "id": "{{ myEntity.id }}" }) in the file src/main/webapp/app/entities/my-entity/delete/my-entity-delete-dialog.component.html then the applications compiles again normally.

github-actions[bot] commented 11 months ago

JHipster has completed the sample check .yo-rc.json: valid Entities JDL: valid Application: successfully generated Frontend check: success Backend check: success E2E check: skipped

mshima commented 11 months ago

Seems to be windows only. CI succeed with the sample.

hide212131 commented 11 months ago

Unfortunately, I believe I've also encountered the error on my local Mac. It seems difficult to reproduce, but I'll investigate it.

mshima commented 11 months ago

Is this duplicated of https://github.com/jhipster/generator-jhipster/issues/23939?

ettolo commented 11 months ago

Same error for me (on windows with Angular frontend); solved removing the single curly brackets: __jhiTransformTranslate__('vehiclemanagerApp.vehicles.delete.question', "id": "{{ vehicles.id }}" ) I don't have the issue of disappearing column names, only not compiling

mshima commented 11 months ago

__jhiTransformTranslate__ should not exist in generated code. Closing as duplicated of https://github.com/jhipster/generator-jhipster/issues/23939. If the problem persist, let me know.

ettolo commented 11 months ago

__jhiTransformTranslate__ should not exist in generated code

... but id does! It is in the file C:\Users\#####\git\myapp\src\main\webapp\app\entities\types\myentityname\myentityname-delete-dialog.component.html File is generated by jhipster import-jdl myentitiesfile.jdl I have enabled translation in initial jhipster generation command: "languages": ["en", "fr", "it"], "nativeLanguage": "en",

mshima commented 11 months ago

__jhiTransformTranslate__ should not exist in generated code

... but id does! It is in the file C:\Users\#####\git\myapp\src\main\webapp\app\entities\types\myentityname\myentityname-delete-dialog.component.html File is generated by jhipster import-jdl myentitiesfile.jdl I have enabled translation in initial jhipster generation command: "languages": ["en", "fr", "it"], "nativeLanguage": "en",

If it does, it’s fixed in main.

ettolo commented 11 months ago

Thank you! But... you mean it will be solved or it is solved in another JHipster version (I have 8.0.0-rc.1)?

mshima commented 11 months ago

You can use main npm install -g jhipster/generator-jhipster#main or wait for a new release. Would be nice if you could test if it works for you.

ettolo commented 11 months ago

I tried with npm install jhipster/generator-jhipster#main and I got the same error. The -g switch gave me errors i couldn't resolve in any way :-(

borisBelloc commented 11 months ago

Hello, I'm new to jhipster, I made a simple project to learn Jhipster and I have the same error.

I made a JDL with JDL-studio.

entity User {
  login String required,
  password String required,
  firstName String,
  lastName String,
  email String required unique,
  activated Boolean,
  lang String,
  createdBy String,
  createdDate Instant,
  lastModifiedBy String,
  lastModifiedDate Instant
}

entity Plant {
  name String required,
  origin String,
  paidPrice Double,
  photo ImageBlob,
}

relationship ManyToOne {
  Plant{user} to User
}

I then used jhipster import-jdl jdl/0.jdl.

Jhipster generated this html file :

<form *ngIf="plant" name="deleteForm" (ngSubmit)="confirmDelete(plant.id!)">
  <div class="modal-header">
    <h4 class="modal-title" data-cy="plantDeleteDialogHeading" jhiTranslate="entity.delete.title">
      __jhiTransformTranslate__('entity.delete.title')
    </h4>

    <button type="button" class="btn-close" data-dismiss="modal" aria-hidden="true" (click)="cancel()">&times;</button>
  </div>

  <div class="modal-body">
    <jhi-alert-error></jhi-alert-error>
    <p id="jhi-delete-plant-heading" jhiTranslate="testjhipsterApp.plant.delete.question" [translateValues]="{ id: plant.id }">
      __jhiTransformTranslate__('testjhipsterApp.plant.delete.question', { "id": "{{ plant.id }}" })
    </p>
  </div>

  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal" (click)="cancel()">
      <fa-icon icon="ban"></fa-icon>&nbsp;<span jhiTranslate="entity.action.cancel">__jhiTransformTranslate__('entity.action.cancel')</span>
    </button>

    <button id="jhi-confirm-delete-plant" data-cy="entityConfirmDeleteButton" type="submit" class="btn btn-danger">
      <fa-icon icon="times"></fa-icon>&nbsp;<span jhiTranslate="entity.action.delete"
        >__jhiTransformTranslate__('entity.action.delete')</span
      >
    </button>
  </div>
</form>

witch generate the same error :

src/main/webapp/app/entities/plant/delete/plant-delete-dialog.component.html:29:1 - error NG5002: Invalid ICU message. Missing '}'.

src/main/webapp/app/entities/plant/delete/plant-delete-dialog.component.html:29:1 - error NG5002: Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.)

Wasn't expecting Jhipster to generate file with problems...

npm install -g jhipster/generator-jhipster#main

finish with an error :

npm ERR! npm ERR!
npm ERR! npm ERR!
npm ERR! npm ERR! > generator-jhipster@8.0.0-rc.1 compile
npm ERR! npm ERR! > tsc
npm ERR! npm ERR! npm WARN using --force Recommended protections disabled.
npm ERR! npm ERR! npm WARN using --force Recommended protections disabled.
npm ERR! npm ERR! npm WARN using --force Recommended protections disabled.
npm ERR! npm ERR! npm WARN using --force Recommended protections disabled.
npm ERR! npm ERR! 'tsc' is not recognized as an internal or external command,
npm ERR! npm ERR! operable program or batch file.

chokkavarapun commented 11 months ago

I tried with previous versions of the Jhipster as well. This issue is still there.

mshima commented 11 months ago

I've just tried, it's working as expected using git main. If there is a way to reproduce using main let me know.

ettolo commented 11 months ago

I don't know what to say... i installed #main on win10, java 17.0.8+9-LTS-211, node 20.9.0 LTS This is the jdl imported

entity Vehicles {
    plate String required unique
    color String  
}

entity Types {
    name String required unique
}

entity Optionals {
    name String required unique
}

relationship OneToMany {
    Types to Vehicles{type required}
}

relationship ManyToMany {
    Vehicles{optional} to Optionals{vehicle}
}

service * with serviceImpl

and this is the yo-rc file after import .yo-rc.json

In the C:\Users#####\git\vehiclemanager\src\main\webapp\app\entities folders of the generated entities i found the errors like

__jhiTransformTranslate__('vehiclemanagerApp.vehicles.delete.question', { "id": "{{ vehicles.id }}" } )

Is there a way to know what exact version of generator i'm running tho be sure i'm running #main?

Thank you for your support, if you need more information please let me know!

ettolo commented 11 months ago

@mshima

If I'm not wrong, in #main generator you still have the cause of the problem line 29 in file https://github.com/jhipster/generator-jhipster/blob/main/generators/angular/templates/src/main/webapp/app/entities/_entityFolder_/delete/_entityFile_-delete-dialog.component.html.ejs

mshima commented 11 months ago

@ettolo still not reproducible. Have you build the project after checking out or used the jit binary? https://github.com/jhipster/generator-jhipster/blob/main/CONTRIBUTING.md#set-jhipster-command-to-use-the-cloned-project

mshima commented 11 months ago

@mshima

If I'm not wrong, in #main generator you still have the cause of the problem line 29 in file https://github.com/jhipster/generator-jhipster/blob/main/generators/angular/templates/src/main/webapp/app/entities/_entityFolder_/delete/_entityFile_-delete-dialog.component.html.ejs

They are replaced at generation time.

ettolo commented 11 months ago

@mshima thank you, using cloned jhipster made the trick, I have really appreciated your support

chokkavarapun commented 11 months ago

@mshima Thank you. Cloning the repo as suggested above resolved the issue. I am seeing one issue with the generated entities. Labels are not getting resolved. UI shows error "Translation missing for xxxxx".

I guess some constants file path is not being resolved. Any clue?

mraible commented 11 months ago

I saw something similar with i18n recently. Refreshing the page fixed it.

vedranstanic82 commented 9 months ago

This issue started happening for me once i changed the Entity holding images from String type to ImageBlob.

vedranstanic82 commented 9 months ago

I'm getting this with issue on 8.1.0

@if (hallImage) { <form name="deleteForm" (ngSubmit)="confirmDelete(hallImage.id!)">

<div class="modal-body">
  <jhi-alert-error></jhi-alert-error>
  <p id="jhi-delete-hallImage-heading">Are you sure you want to delete Hall Image {{ hallImage.id }}?</p>
</div>

<div class="modal-footer">
  <button type="button" class="btn btn-secondary" data-dismiss="modal" (click)="cancel()">
    <fa-icon icon="ban"></fa-icon>&nbsp;<span>Cancel</span>
  </button>

  <button id="jhi-confirm-delete-hallImage" data-cy="entityConfirmDeleteButton" type="submit" class="btn btn-danger">
    <fa-icon icon="times"></fa-icon>&nbsp;<span>Delete</span>
  </button>
</div>

}

it is having problems with "if (hallImage) {" in the ...../hall-image/delete/hall-image-delete-dialog.component.html

this syntax is present only in the "image-delete-dialog" files. this seems like a leftover of some pre-processing (is not Angular code)

i did play with having the image first be "string" then "ImageBlob" then "string" again in the course of the project setup (in JDL). Perhaps it's somehow stuck? how do i "nuke" the whole project and rebuild without any cache?

EDIT: actually this syntax is all over my newly regenerated files using the jhipster entity Hall command...this is so confusing...

brother-den commented 9 months ago

I'm getting this with issue on 8.1.0

@if (hallImage) {

Confirm delete operation
  <button type="button" class="btn-close" data-dismiss="modal" aria-hidden="true" (click)="cancel()">&times;</button>
</div>

<div class="modal-body">
  <jhi-alert-error></jhi-alert-error>
  <p id="jhi-delete-hallImage-heading">Are you sure you want to delete Hall Image {{ hallImage.id }}?</p>
</div>

<div class="modal-footer">
  <button type="button" class="btn btn-secondary" data-dismiss="modal" (click)="cancel()">
    <fa-icon icon="ban"></fa-icon>&nbsp;<span>Cancel</span>
  </button>

  <button id="jhi-confirm-delete-hallImage" data-cy="entityConfirmDeleteButton" type="submit" class="btn btn-danger">
    <fa-icon icon="times"></fa-icon>&nbsp;<span>Delete</span>
  </button>
</div>
} it is having problems with "if (hallImage) {" in the ...../hall-image/delete/hall-image-delete-dialog.component.html

this syntax is present only in the "image-delete-dialog" files. this seems like a leftover of some pre-processing (is not Angular code)

i did play with having the image first be "string" then "ImageBlob" then "string" again in the course of the project setup (in JDL). Perhaps it's somehow stuck? how do i "nuke" the whole project and rebuild without any cache?

EDIT: actually this syntax is all over my newly regenerated files using the jhipster entity Hall command...this is so confusing...

Yup, same thing happened to me. Updated a column in my JDL from required to not required and it changed the ngIf's and ngFor's in the entity folder to @if/@for

jhipster / generator-jhipster