Angular - iOS Blank Pages - javascript

I've just installed Angular and I'm facing two blank page problems:
1) Blank Angular.io Website On iOS 7
My iPad (running iOS 7) just sees a blank page when I try to load the Angular.io website, both via Safari and Chrome apps. I thought iOS 7 is supported by Angular (source), isn't it? It does display properly on my iPhone running iOS 9.
It is important that the Angular website I will build can be viewed properly on older devices too, so I wanted to know if it has problems supporting iOS 7.
2) Blank Mobile Page With Ng Serve
I installed the Angular test app and I can see the test page fine on my computer browsers (both local and networked computers).
However, if I load it on my iPhone or iPad, the page is completely blanked, both on Safari and Chrome apps. I do see the tab's title "My App", so it is able to connect properly to my ng serve --host 0.0.0.0 but the page just does not render. It does render fine on my Android 7 device's stock & Chrome browsers.
I've connected my iPhone / iPad's Safari to my Mac's Safari inspector, and got the following errors when loading the My App demo page:
[Error] SyntaxError: Unexpected token 'const'
../../node_modules/webpack-dev-server/client/index.js?http://0.0.0.0:0 (vendor.bundle.js:514)
__webpack_require__ (inline.bundle.js:55)
(anonymous function) (main.bundle.js:66)
__webpack_require__ (inline.bundle.js:55)
webpackJsonpCallback (inline.bundle.js:26)
As for Angular.io website, the following error shows:
[Error] ReferenceError: Can't find variable: WeakMap
LMZF (main.7d151f1f7f0a94ae41e1.bundle.js:1:142339)
n (inline.ad7fd106f6c55b1fd8ed.bundle.js:1:106)
cDNt (main.7d151f1f7f0a94ae41e1.bundle.js:1:284246)
n (inline.ad7fd106f6c55b1fd8ed.bundle.js:1:106)
(anonymous function) (main.7d151f1f7f0a94ae41e1.bundle.js:1:2317)
n (inline.ad7fd106f6c55b1fd8ed.bundle.js:1:106)
webpackJsonp (inline.ad7fd106f6c55b1fd8ed.bundle.js:1:430)
I tried searching around and some solutions mentioned about updating webpack-dev-server, enabling polyfills, or changing tsconfig.json to es5, all of which I tried but it didn't seem to work.
Can someone please advise? Thanks.

Related

Asto SSR generated code doesn't run on older versions of iOS

I am hosting astro SSR site on Netlify. It works well everywhere except when I test on iPhone 6 and older. Basically all script executions are stopped and the site is no longer interactive.
Errors from Safari on iPhone 5SE Simulator:
[Error] SyntaxError: Unexpected token '.'
[Error] The source list for Content Security Policy directive 'script-src' contains an invalid source: ''strict-dynamic''. It will be ignored.
[Error] The source list for Content Security Policy directive 'script-src' contains an invalid source: ''strict-dynamic''. It will be ignored. (x2)
[Error] Unhandled Promise Rejection: SyntaxError: Unexpected token '?'
[Error] Unhandled Promise Rejection: SyntaxError: Unexpected token '?'
I am not really sure how to fix this issue. Any help would be appreciated.
PS: I used svelte for building astro islands and google recaptcha(v3) in the page that is being tested. The page works fine on development environment.
This sounds like you have some code using optional chaining, e.g. object?.potentiallyMissingProperty. Per caniuse, this only works on iOS Safari versions 13.4 and later. An iPhone 6 can only install iOS 12, so using this syntax will throw an error on those devices.
This appears to be an issue within Astro, which does not support some older browsers. Astro also scopes CSS with :where, which will also break on older versions of Safari. On those browsers, your page's HTML should render, but any JavaScript will not work and should be treated as a progressive enhancement.

nativescript 4.2. Error while building android app with release flag

I've done some app for IOS and Android.
IOS is working fine and it's poblished on App store since 3 weeks.
So, the time has come for android. I have to do some css tweaks, beacuse android was looking different in some aspects.
After when i did it, i run tns run android, next emulator appear.
All is working well, so i've run tests on Firebase console.
It was a suprise for me, beacuse i saw this error: (Emulator installed is launching app without issues.)
Nativescript fails to load code that holds common js functions.
Here is part of my app.js
And, right now i'm able to see this error in my emulator.
Steps to reproduce:
- run tns run android (app is working well)
- do some typo in any js file (make any error): livesync will run again, and as result i will see this error.
My question is: do android have problems with requiring this file? IOS is working very well, but i'm unable to deploy android.
Thank you.

Meteor: Can’t get updates to Android Emulator (Hot Code Push)

I'm doing mobile development on an Android Emulator with Genymotion. I can't get any code changes to show up on the emulator. I always get this error, even on Startup:
Skipping downloading new version because the Cordova platform version or plugin versions have changed and are potentially incompatible
I know this a protection mechanism from bad updates, but It happens all the time. I can't even make a small CSS or JS change. They all get blocked. I tried it on Android 4.4.4, 5.0 and 6.0.
I'm using Meteor 1.4.1.2 and I simply run meteor run android-device and it pops up on the Genymotion device.
Anyone know what's causing this?

Webpack + React and Google Chrome 43.0.2357.65

After updating Google Chrome (v. >= 43.0.2357.65) error was displayed in console: Uncaught SyntaxError: Unexpected token function in different places of my bundle.js.
It appears only when bundle.js returns 200 http status. But after refresh page this file returns 304 http status and all works fine without errors. I'm using webpack v.1.8.5 and React v.0.13.2
In other browsers code works fine, and in Google Chrome before update it works fine.
See this Chrome issue and this related Twitter conversation from the person who filed it.
If you're using an older version of Node.js in your build, updating it might fix this. From the issue:
broken.js was the result of a build script running in Node.js 0.10.18, which seems to have written the file with some peculiar character encoding issues

Errors trying to build Cordova Window app

I have a cordova application that runs fine on android, iOS and wp8. Now we would like it to run on windows. I have added the platform using the following command
cordova platform add windows
This adds all the plugins for me, now i build the project using
cordova build windows
For some reason my plugins and other basic features are not working. For example, i have the following cordova plugins installed
cordova plugin list
org.apache.cordova.splashscreen 1.0.0
org.apache.cordova.statusbar 0.1.10
org.apache.cordova.console 0.2.13
org.apache.cordova.camera 0.3.6
I havent tried camera yet, but upon my application starting, i try to hide the splash screen and status bar, and i get these errors
Exception was thrown at line 96, column 9 in
ms-appx://MY.APP.ID/www/plugins/org.apache.cordova.statusbar/src/windows/StatusBarProxy.js
0x800a138f - JavaScript runtime error: Unable to get property
'hideAsync' of undefined or null reference
and
Exception was thrown at line 82, column 9 in
ms-appx://MY.APP.ID/www/plugins/org.apache.cordova.splashscreen/www/windows8/SplashScreenProxy.js
0x80004002 - JavaScript runtime error: No such interface supported
I have even tried to show a console.log, which never shows anymore? I know in WP8 projects you have to change the DEFINE DEBUG flag, but i cannot find this on the new windows project.
To get round console, i thought i would try and show an alert, which you can do with
(new Windows.UI.Popups.MessageDialog("Content", "Title")).showAsync().done();
But i get an error message of
Exception was thrown at line 47, column 9 in
ms-appx://com.measure2improve.m2ianywhere/www/plugins/org.apache.cordova.dialogs/src/windows/NotificationProxy.js
0x80070005 - JavaScript runtime error: Access is denied.
I am obviously missing something here, if someone could let me know what i have missed, would be very much appriecated.

Categories