Polymer 2.0 webcomponents-loader.js is missing Edge polyfill - javascript

We currently updated a project from Polymer 1 to the Polymer 2/ hybrid version.
I know that webcomponents-hi-sd-ce.js is the polyfill for edge.
When testing the page on Microsoft Edge I now get an error indicating that webcomponents-hi-sd-ce.js.map could not be found (404).
The same error occurs when loading the project with webcomponents-lite.js
I couldn't find similar cases so I figured this might be a issue in Polymer 2. I tried importing the script directly by myself but that didn't help either.
I would appreciate if someone could help me out here or share his experience with a similar problem.
The exact error from Edge v.38:
HTTP500 + for some reason the file path is shown incorrect even though it is actually right in my folder.
https://..../bower_components/webcomponentsjs%20[synthetic:util/global]

Debugging the loader, I've found the following issue:
For each absent native platform feature (as determined by the loader) an acronym will be appended to the polyfill URL.
Unfortunately, for some combinations of features—-as with MS Edge—-the resulting path is unavailable.
This might have been resolved meanwhile, but I've moved on to just using webcomponents-lite (since we're only supporting Edge).

There seems to be an issue with webcomponentsjs (version ~1.0), that applies to webcomponents-loader and webcomponents-lite. It should work whenever you load the app with F12-Tools closed.
See https://github.com/PolymerElements/polymer-starter-kit/issues/1025 for details, especially July 27th's comment.

you should use the webcomponents-loader like so
<!-- Load polyfills; note that "loader" will load these async -->
<script src="bower_components/webcomponentsjs/webcomponents-loader.js"></script>
also a missing map file should actually be no problem as this is "just" used while debugging to see "readable" code instead of the compressed version.
also depending on your Edge version you may need to transpile your code to es5 using polymer build.

Related

Vis.js throwing exception after switching to network version

I am using vis.js 4.18.1 currently for a project, which is running on IE11. So far everything worked good, but now I'm trying to add extra functionality for adding edges, etc, and when working on the events, I didn't have my controlNodeDragEnd event fired and I thought its not in my version yet and anyway it would be better to use the latest version (I already had a lot of work done, when i realized I am using the old github project)...So, long story short, I downloaded the latest vis-network.js and the corresponding CSS file. Exchanged it with the old ones and now I get the following error when trying to display my diagram:
SCRIPT5007: Object.getPrototypeOf: 'this' is not an Object
vis-network.js (7074,9)
I am not using npm, I need the js file in my project, am I missing some dependencies maybe?
Didn't change anything else, all my networks were displayed without error in 4.18 and 4.21.
The reason is a known bug, already in progress:
https://github.com/visjs/vis-network/issues/57
Closing question, this should fix it, when finished.

How to solve TypeError for app on IE11 - AngularJS?

I have an Angular5 single-page app that works perfectly on Google Chrome, Firefox, Microsoft Edge and mobile browsers. However, with IE11, I get the errors:
ERROR TypeError: Object doesn't support property or method 'find'
and
ERROR TypeError: Object doesn't support property or method 'startswith'
Based on Angular docs, it's supposed to support IE11. I tried to apply fixes on the browser settings (as per Microsoft forums) like reset Advanced Settings in Internet Options and trying in compatibility mode, etc. But nothing on the browser configuration worked.
Is there any special configuration required on Angular side to make it work on IE11? How can I fix the errors mentioned above?
I'm not sure which code samples may be relevant, please let me know and I can provide. Thanks.
EDIT: More details on the accepted solution can be found in Angular - Browser Support. Specifically, enabling polyfills.
There should be a file called
polyfills.ts
In it, you can uncomment various polyfills for different browsers. Just read the commentblocks.
Those errors pop because IE doesn't implement those functions.
To resolve this, simply look for the functions on MDN's website.
For instance, here is the find method.
If you go to the bottom of the page, you will find a polyfill for this function (in the page I gave you, in french, it is Prothèse d'émulation).
Simply copy and paste your code into a Typescript file, and import that typescript file into your project.

Extending jQuery in Internet Explorer 11

My company recently launched a website and we're getting a JavaScript error often in IE11.
Object doesn't support property or method '[ext. func name]' [Internet Explorer 11.0]
In our code we're frequently extending jQuery with the following syntax:
$.fn.center=function() { ...... };
The error message always happens on those functions. Is there a solution to this? Or at least an explanation? I'm ok with changing the code but I'd like to understand why it is happening as well.
I have not been able to reproduce this issue in IE11 myself. The only reason we're able to see the errors is because we're AJAX'ing all clientside errors to ourselves via window.onerror.
I am not sure about jQuery, but if you use compilation for your project, you might consider to add at the top of your entry point
import 'core-js'
At the moment core-js polyfill library is the easiest way to make Cross Browser Support

After switching static resources to CDN, google maps error in Chrome+Firefox, fine in Safari:

I'm just looking for any pointers to help me narrow my debugging.
My site is working fine without using a CDN. If I use a CDN (Edgecast, but also another one I tested on), then my Google maps embedded in the pages don't show up in Chrome and Firefox, but do show up fine in Safari (all latest versions, cannot test it on IE).
Switching off the CDN setting in my application (social engine) corrects it, so it really is CDN-related.
If I save the html source on my local machine and view it in a browser locally, then it works fine as well.
I have another feature of my site, a JS slideshow, that is not working as well, following the same pattern. The only thing that changes when I switch on and off the CDN are the locations of JS, CSS and image files.
I've tried many things, do not see any errors in the console, and I'm just puzzled by the behavior. If anyone has any pointers to further investigate, based on the patterns descibed, I would be much grateful.
If you want to have a look at a page working fine in Safari but not in Chrome/Firefox, you can have a look at http://healthylivingtribes.com/paleo-primal-resource/ovvio . The "map" tab should display a Google map.
Many thanks in advance for your help.
Best,
- Julien
I got the same error:
Uncaught TypeError: Array.prototype.forEach called on null or undefined at mootools-1.2.5-core-nc.js:81
and found a solution that works for me:
In the file mootools-1.2.5-core-nc.js (or wherever else your code resides, seems to work for older versions too) replace the following line (#2901 in mootools-1.2.5-core-nc.js):
var rules = sheet.rules || sheet.cssRules;
by this line:
var rules = sheet.rules || sheet.cssRules || [];
Apparently neither sheet.rules nor sheet.cssRules are necessarily properly initialized, so simply assigning an empty array as a third alternative to the variable rules fixes it.
For some reason Chrome seems to be more sensitive (or accurate) here than the usual suspects... ;)
Accordingly, if you are using a compressed version, replace this line (well, compressed line):
var F=E.rules||E.cssRules;
by this:
var F=E.rules||E.cssRules||[];
Since in the compressed versions internal variables are renamed to shorter values, your variable might not actually be named F as in my case, but you get the idea :)
EDIT: As this seems to be an actual bug, I reported it to the MooTools Core bugtracker, so maybe they will fix it in the official releases (https://github.com/mootools/mootools-core/issues/2345).
Well, I haven't found the answer but it is related to the another JS which prevents Google maps to appear.
Still no clue about the difference between Safari and Chrome, but I've now isolated the socialengine plugin which causes this.
It's CDN-related for sure though, and still works perfectly fine in Safari, so if anyone has any hypothesis, I'll still be interested in hearing them :-)
I got this error too and tried upgrading mootools from 1.2.5 to 1.4.5 - but the error changed to:
Uncaught ReferenceError: Asset is not defined
I then used the Mootools builder here: http://mootools.net/more/#Assets
(Select ALL, Include compatibility, No compression)
... and the slideshow is now working.

NPAPI plugin problems in Windows 7

I have a NPAPI plugin which I have written and been using for some time with Firefox 3.x with no problems.
The object is defined as follows -
<object class="someClass" id="pluginobj" type="application/x-plugintype"></object>
I then call methods on it using the following format -
if( document.getElementById("pluginobj") != null )
{
document.getElementById("pluginobj").someMethod(someParams));
}
This is how I understand it should be done and has always worked fine. However, I recently installed this same plugin on a Windows 7 machine (with the same version of Firefox) and it now fails to find the functions defined in the plugin, so I get the following error -
Error: document.getElementById("pluginobj").someMethod is not a function
Nothing has changed at all within the plugin, this errors occurs for any method that is called, not a particular one, and it still works fine on Windows XP machines with no problems.
Very confused! Could anyone help? Thanks.
Note: I've also tried logging inside my plugin and it appears it's not even getting in to the NP_Initialize and NP_GetEntryPoints methods.
I have seen some suggestions around that it could be to with dependencies and libraries being linked to the plugin, but i'm not sure what could be missing on win 7?
Dependency Walker is showing a error saying that the "side-by-side configuration information is incorrect"?
Are you linking to other DLL files from your npapi plugin? Windows 7 works differently in how it finds DLL files, though I don't know the details. The times I've seen this with plugins in the past the problem was that on windows 7 one of the dll files couldn't be found. You could try copying dependency dll files to your system32 directory (not permanently, just to see if that's the issue). I would expect that there it would be able to find it.
If that's the issue, I unfortunately am not certain how to fix it, but it might help.
Another possibility based on the side-by-side configuration issue thing is that your visual studio project is creating a manifest that is telling windows that it requires a specific version of one of the DLLs that isn't there on windows 7. See: http://buffered.io/2008/05/17/resolving-side-by-side-configuration-issues/
I think I've resolved that issue in plugins before by disabling the manifest. I'm not sure; I've never had this issue with the way that FireBreath generates npapi plugin dlls, so I haven't needed to worry about it in the last year. You might consider looking at FireBreath, which works on both IE and Firefox (activex and npapi) and has a very good community for tracking down issues like this.

Categories

Resources