"TypeError: Cannot read properties of null (reading 'baseUrl') in @formio/angular 7.0.0 &...

I'm integrating @formio/angular (version 7.0.0) and formiojs (version 4.21.5) into a lazy-loaded module in my Angular application. However, I'm encountering the following error when trying to render a form using the Formio component:

TypeError: Cannot read properties of null (reading 'baseUrl')
at getOptions (Webform.js:94:38)
at new Webform (Webform.js:130:38)
at Form.create (Form.js:128:16)
at Form.setForm (Form.js:213:47)
at new Form (Form.js:92:13)
at FormioComponent.createRenderer (formio-angular.mjs:290:23)
at FormioComponent.setForm (formio-angular.mjs:311:28)
...


Project Structure The Formio module is imported and used in a lazy-loaded module, as shown below:

import { FormioModule } from '@formio/angular';

@NgModule({
imports: [
CommonModule,
RouterModule.forChild(routes),
FormioModule
],
declarations: [
Components,
]
})
export class SomeModule {}


In my component, I'm using the Formio component like this:

<formio [form]="dataOfForm"></formio>


The formData is a valid schema object (sample below):


this.dataOfForm = {
components: [
{
key: 'textfield',
type: 'textfield',
label: 'Example Text Field',
input: true,
},
],
};


Debugging Formio.baseUrl, which logs null at runtime. Package Versions @formio/angular: 7.0.0 formiojs: 4.21.5

Why is baseUrl null despite configuring FormioAppConfig? Is there a specific way to handle FormioModule in lazy-loaded modules? Could this be a version compatibility issue between @formio/angular and formiojs? I would really appreciate any insights on this, i dont know if its a small issue or big one.

I have also tried loading the testing formio component using src instead of json, but the result remains the same. Ensuring the FormioModule is imported correctly in both the root module and lazy-loaded module. Providing the FormioAppConfig in AppModule: providers: [ { provide: FormioAppConfig, useValue: { appUrl: 'url', apiUrl: 'url', }, }, ],

I also tried exploring sites for this but i couldnt find any answers.

Continue reading...