Welcome Guest Search | Active Topics | Sign In | Register

Angular navigation failing in EO Browser Options
JoshD
Posted: Friday, May 21, 2021 4:44:07 PM
Rank: Member
Groups: Member

Joined: 8/11/2015
Posts: 19
We have been using the EO Browser successfully in a WPF application to display an in-house web app built using the Ionic framework and Angular 5. We have just updated that app to use Angular 11 and it no longer runs in the EO Browser (never seems to load - just a blank screen).

To test compatibility, I created a new, essentially empty Angular 11 app, using "ng new", and loaded that in the EO Browser. which it did successfully. I then added the simplest navigation, using Angular routing to switch between two components by clicking one of two buttons. This works fine in a normal browser, but in the EO Browser the buttons are present, but appear non-functional, with the components never loading. The EO debugger is active and open, but no errors appear in the console when clicking the buttons. The only error noted in the console is an "Unhandled Navigation Error" on page load when the EO Browser is first started.

We're using the latest version of the EO Browser (v21.1.11.0). As I've said, the modifications to a generic Angular app have been minimal, just:

<a routerLink='page1'>Page 1</a>
<a routerLink='page2'>Page 2</a>
<router-outlet></router-outlet>

as the entire source of the app.component.html page and

const routes: Routes = [
{ path: 'page1', component: Page1Component },
{ path: 'page2', component: Page2Component },
];

as the entire set of routes in the app-routing.module.ts page. No other modifications have been made. Needless to say, it runs fine in a normal browser.

The app was built using "ng build --prod", which generates seven files:

3rdpartylicenses.txt
favicon.ico
index.html
main.11250cfc70c0b1e31635.js
polyfills.94daefd414b8355106ab.js
runtime.7b63b9fd40098a2e8207.js
styles.09e2c710755c8867a460.css

The development build, "ng build", which generates many more files, mostly source mappings, also failed to run properly.

Note: inside index.html, there's a <base href> tag in the <head> section. The build generates this as <base href="/">, but to get the EO Brower to load the additional files, I had to remove the slash, so that the tag now reads <base href="">.

Any insight as to what might be going on here would be deeply appreciated.
eo_support
Posted: Monday, May 24, 2021 10:30:48 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,217
Hi,

We are not familiar with Angular. Do you have the site online that we can access here? You can also send the files to us and we will try to load it here. See here for details on sending files to us:

https://www.essentialobjects.com/forum/test_project.aspx

Thanks!


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.