Unknown component found! view / dmxRouting.js not added

[Apple]

Wappler Version : 4.4.4
Operating System : MacOS Big Sur
Server Model: NodeJS
Database Type: None
Hosting Type: Docker (for some reason it was initially setup with native’s NodeJS instead of Docker, though I’m almost sure I selected Docker during project creation, but whatever, maybe I did a mistake)

Expected behavior

SPA internal routing works

Actual behavior

• SPA internal routing broken (browser uses traditional page load instead)
• dmxRouting.js not automatically appended to master page
• Console says “Unknown component found! view”
• Home link in first navigation bar becomes this crazy href after saving the page (instead of “/”):

<a class="nav-item nav-link" href="../../../../../../../" internal>Home</a>

How to reproduce

I have attempted to create a test project, which you download below. This project was created to troubleshoot another issue with SPA internal routing, but it seems I found this bug instead. The 2nd bug report will be created after this one is solved, as otherwise I can’t attempt to replicate the 2nd bug since SPA routing is not working in first place

bootstrapNavigation.zip (8.3 MB)

Edit: To save time for the Wappler team, the 2nd bug is related to dmxBootstrap5Navigation.js: when SPA routing is used, the navbar(s) loaded through the SPA fragment are not marked with class “active”. This is a time-sensitive bug, because if you run _update() again the elements are properly marked as “active”. This is what the project above attached aims to demonstrate, hence one main navbar in the master page (Home), and two navbars added on other pages (About and Contact) - these “other pages” are to be loaded through HTML/SPA fragments

[Apple]

@Teodor you might be interested in the dmxBootstrap5Navigation.js issue: when you load a navbar through a fragment, not always the class “active” is applied. If you call the _update() function of dmxBootstrap5Navigation.js again the navbars are marked as “active” correctly

Sounds like the _update() function is called upon DOM update but the fragment is not fully loaded yet (?)

If you somehow manage to load dmxRouting.js on the project above (you can download) you may be able to see the issue. Tested on Firefox

[Teodor]

Ok i was able to recreate the issue with the internal links and dmxRouting.js not being added @George will check this.

As for the nav active state - please post a different bug report explaining what’s wrong.

[George]

Do you have in your project settings, Links relative to site root? This should always be the case for NodeJS projects. Specially when using partials and such - as those will never be relative to the document.

[Apple]

Hi George,

Looks like it was set as relative to document instead of site root. Maybe it would be a good idea to set it as default for new NodeJS projects.

With the option above changed, the following issue concerning the href has been fixed:

<a class="nav-item nav-link" href="../../../../../../../" internal>Home</a>

dmxRouting.js is still missing from the page

[Teodor]

This has been fixed in Wappler 4.4.5 - dmxrouting.js is now added on the main page.
For new projects site root relative links are automatically set.