DatePicker: Unable to display DatePicker with the error message "CLDR data for locale en is not loaded!"

Describe the bug A clear and concise description of what the bug is.

Isolated Example Please provide an isolated example if possible by forking this codesandbox.

Screenshots The datePicker is unable to display, and in the console, we have the following error: Uncaught (in promise) Error: CLDR data for locale en is not loaded! at Object.getModuleContent [as loadResource] (LocaleData.js:77) at getOrLoad (LocaleData.js:2664) at getData (LocaleData.js:2691) at new constructor (LocaleData.js:12) at Function.push…/node_modules/@ui5/webcomponents-localization/dist/sap/ui/core/LocaleData.js.LocaleData.getInstance (LocaleData.js:2726) at getCachedLocaleDataInstance (getCachedLocaleDataInstance.js:7) at HTMLElement.get _primaryCalendarType [as _primaryCalendarType] (DatePicker.js:764) at HTMLElement.onBeforeRendering (DatePicker.js:470) at HTMLElement._render (UI5Element.js:533) at Function.renderImmediately (RenderScheduler.js:46) at HTMLElement.connectedCallback (UI5Element.js:145)

UI5 Web Components for React Information @ui5/webcomponents version: 1.0.0-rc.10 @ui5/webcomponents-react version: 0.12.3 Operating System: macOS/Windows Browser:Chrome

Additional context Add any other context about the problem here.

Issue Analytics

State:
Created 3 years ago
Reactions:1
Comments:5 (2 by maintainers)

Top GitHub Comments

3reactions

MarcusNotheiscommented, Jun 23, 2022

Hi @L3K0V, this issue is caused by https://github.com/SAP/ui5-webcomponents/issues/5394. It is fixed in the meantime but not released yet.

Anyways, this error should only occur in dev environments - for production use cases it’s recommended to import Assets.

In you case this would be:

import '@ui5/webcomponents/dist/Assets.js';
import '@ui5/webcomponents-fiori/dist/Assets.js';
import '@ui5/webcomponents-react/dist/Assets.js';

Please note that this is currently not working in codesandbox but is already fixed and will be released soon.

0reactions

L3K0Vcommented, Jun 23, 2022

"@ui5/webcomponents": "~1.3.1",
"@ui5/webcomponents-fiori": "~1.3.1",
"@ui5/webcomponents-icons": "~1.3.1",
"@ui5/webcomponents-icons-business-suite": "~1.3.1",
"@ui5/webcomponents-react": "^0.23.2",

same behaviour with:

"@ui5/webcomponents": "~1.4.0",
"@ui5/webcomponents-fiori": "~1.4.0",
"@ui5/webcomponents-icons": "~1.4.0",
"@ui5/webcomponents-icons-business-suite": "~1.4.0",
"@ui5/webcomponents-react": "^0.25.5",

Top Results From Across the Web

Uncaught TypeError with datepicker localization - EJ 2 Forums

I know it's because CLDR data is not loaded correctly, but I hope to make it work on the current project which is...

Bootstrap 3 Datepicker and DateTime validation error

After a lot of hours, I finally found a way to create a good solution, based on the jQuery Validation Globalize Plugin:.

SwiftUI Date Picker is Problematic | Apple Developer Forums

The date format is getting changed with specific dates and not everytime i select a new one. BUT, I found a workaround. You...

Troubleshooting - Internationalization - Kendo UI for Angular

The error messages are self-explanatory and display a unique name and a corresponding message. Error Code, Reason, Solution. "NoLocale", The data for the...

Localization: DevExtreme - JavaScript UI Components for ...

Then, include Globalize, CLDR, and language-specific CLDR data using the import or require statement—the statement depends on the syntax for working with ...