Git Product home page Git Product logo

winstore-jscompat's Introduction

JavaScript Dynamic Content shim for Windows Store apps

Use all your favorite JavaScript libraries to create Windows Store apps on Windows 8

Developers can use a wide variety of JavaScript APIs to leverage the power and broad capabilities of Windows in Windows Store apps. In order to prevent unwanted access to the Windows Runtime, restrictions and measures restrictions and measures are set in place so that malicious script will not compromise an app's integrity. In some cases, however, this security model may prevent some JavaScript libraries to run as intended. A handful of popular, third-party libraries happen to use code which is flagged as unsafe, and therefore will not work as expected in Windows Store apps. These libraries include but are not limited to AngularJS, Ember.js, KnockoutJS.

Today, running a Windows Store app using AngularJS in Visual Studio might return the following error: "JavaScript runtime error: Unable to add dynamic content. A script attempted to inject dynamic content, or elements previously modified dynamically, that might be unsafe."

Properties such as innerHTML and outerHTML are filtered in order to avoid the common security issues that can result from the unsafe handling of untrusted data.

In order to unblock these setbacks, Microsoft Open Technologies (MS Open Tech) has released the JavaScript Dynamic Content shim for Windows Store apps. This mitigation relaxes the manner in which checks are performed, yet still achieves the fundamental goal set by the security model.

Instructions

Simply reference the winstore-jscompat.js file towards the beginning of your app, before any other scripts are run.

Note: You do not need to include this file for Windows 10 apps.

Please note that there may be a minor impact on your app's performance, the extent of which depends upon the specific usage, timing, and frequency of the three property calls listed above.

winstore-jscompat's People

Contributors

jayrenn avatar panarasi avatar pgills avatar spankyj avatar xirzec avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

winstore-jscompat's Issues

Popovers are not poping up

When I am adding this file. In Windows phone application popovers are not working. Its not poping them

Run error at Windows Phone

I've been participating a Ionic Project that has been developed on Android and IOS,
Sometime on the project development we need a windows phone version.
Well we used winstore-jscompat , and our code worked pretty well with some issues that can be fixed.
But after detecting some errors on cordova-plugin-file and cordova-plugin-media on Android and IOS and resolving then with removing and adding the plugins, We found some bizarre errors on trying to compile for WP (Universal).

Running on Windows 10 Phone Emulator:

'WWAHOST.EXE' (Script): Loaded 'Script Code (MSAppHost/2.0)'.
The program '[2988] WWAHOST.EXE' has exited with code 3 (0x3).

Running on Windows 8.1 Phone Emulator or Device:

'WWAHOST.EXE' (Script): Loaded 'Script Code (MSAppHost/2.0)'.
The program '[3280] WWAHOST.EXE' has exited with code 1 (0x1).

I use Visual Studio 2015 RC on WIndows 10

Well I just don't know what do.
I Hope that someone with good hearth could give me some direction ^^'
Thanks for the attention

Edit:
It is a Onesignal-cordova-plugin issue. This closes #23.

0x8000FFFF Javascript Runtime Error: Invalid Calling Object

I'm getting a 0x8000FFFF Javascript Runtime Error: Invalid Calling Object. The line the exception points to is:

  function insertAdjacentHTML(element, position, html) {
      HTMLElement_insertAdjacentHTMLPropertyDescriptor.value.call(element, position, html);
    }


I am building a Cordova app with the Windows target, running in WP8.1.

Additional problem with css properties

Hello,

I have solved the first part of the issue adding this file to my project but in Sencha Touch I am having the same problem with determinated css classes.

Any clue what am I doing wrong?

Thank you in advance.

i18next

It would be nice if it worked with i18next

Multi-device Hybrid App Template + WinJS = buggy single page navigation

I've been playing around with the Multi-device Hybrid App template (CTP2) and working on a single-page navigation style app using the WinJS UI. I'm calling a navigate function that loads HTML fragments into a root page... and these fragments contain other scripts that need to run. I've had very few problems making this run on Android and iOS, but Windows 8 and WP8 have given me no end of problems. I wasn't getting any errors thrown so it took a while but I managed at one point to make everything work on Windows by using path names that start with "./" and using path names completely relative to the current html document. (i.e. using lots of ../../folder/file.js style paths)

However, since upgrading to CTP3, this behavior is now gone... meaning the navigation is completely broken again. I began exploring potential problems and decided to comment out the winstore-jscompat.js file that is automatically included in the MDHA template. IT WORKED! I would like to keep using this shim because it fixes compatibility issues with other libraries, but for now it seems to not work well with the navigation model used by WinJS and the current MDHA template.

If needed, I can upload a sample solution that demonstrates this problem.

TypeScript + Cordova + SystemJS

Using SystemJS v0.19.3 for TypeScript + Cordova project. When I run my builds against windows phone 8.1 or windows phone 10 (physical or emulator) I get a JavaScript runtime error: Unable to load dynamic content

Windows security model appears to prevent SystemJS from running. Specifically, the problem is with document.write('<script type="text/javascript" src="'+o+'system-polyfills.js"></script>')



Winstore-jscompat.js is in the html. I'm not sure if this is an issue with SystemJS or Winstore-jscompat?

StackOverflow question: http://stackoverflow.com/questions/32937023/vs2015-cordova-systemjs-security-restriction-error-0x800c001c

Style element when using Angular Material

Hi,

I'm trying to use the Angular-Material library in an Apache Cordova app. On my Windows Phone (8.1) angular-material tries to insert a style block to the section. Winstore-jscompat wraps this style block in a and instead of a leaving it just the <style>, which makes the whole thing unusable.

The result looks like this:

<style>/*lots of generated styles*/</style>

When I do not include winstore-jscompat.js the styling of the app works as expected, but the app breaks in other areas where html is injected.

Script worked partially; onclick events still don't work

Hi, I have this meta tag in the header in order to allow all type of scripts to run:

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src * data: 'unsafe-inline'; connect-src * 'unsafe-inline'; frame-src *" />

Yet all the onclick events from dynamically generated (with jQuery) objects with this method:

$('#frm_login').append('<button class="uibutton blue" id="btn_login" onclick="javascript:doLogin()">Login</button>');

are failing miserably. They do worked when using the old WP8 platform in Cordova, but not anymore with the Windows platform when compiled for WP8 (appx).

Notice the .append() method works now thanks to the winstore-jscompat.js file, but not the events. This is really frustrating, I'm about to return to the discontinued WP8 platform unless I find a solution soon. Thanks in advance for your cooperation.

Crashes with ReactCSSTransitionGroup

I'm experiencing a weird issue when using using this lib with ReactCSSTransitionGroup.

I have a transition that is working fine in conjunction with react-router (simply fading page transitions).

However when using the transition group for a carousel, the app crashes (unpredictably and intermittently when changing slides).

If I remove winstore-jscompat and continue to use the transition group, the app crashes with the dangerous dom insertion issue.

So far, the only workaround I've found is to render all of the carousel items to the DOM, and then apply an active class modifier - this is not good for performance.

It seems to me the thinking with adding these security rules in metro was not great - they cause problems with the frameworks people actually use to create app like experiences. Thanks for your efforts with this library to try and address them

Call to native createContextualFragment fails

Hi...

I'm trying to setup a project with smartclient framework, and i've noticed that on windows platform it doesn't work because framework internally call to createContextualFragment and insertAdjacentHTML to generate dom contents.
And it throws an exception (HTML1701: Unable to add dynamic content errors...)

May be possible to override native calls for these methods in order to work with this framework with cordova on windows platform?

Cannot run OpenUI5+Cordova on Windows Phone

Hi,

I'm trying to setup a Windows Phone 8.1 app to work with OpenUI5 using Apache Cordova. I created a concept testing project merging the hello world samples of OpenUI5 and Apache Cordova to check if Windows Phone apps support OpenUI5 Javascript framework.

I cannot resolve the error "JavaScript runtime error: Unable to add dynamic content.." with or without including the winstore-jscompat.js

Here is the test sample: https://www.dropbox.com/s/rotr7bkqyy49nvx/Test.rar?dl=0

Any help would be appreciated. Thanks!

Problem with the focus of a input type text when click on it

Hi, I am trying to build a Windows 8 app with angular, I followed the "Building Windows 8 Applications with AngularJS aka Oh Yes I Did!" tutorial step by step, and it almost worked perfectly.

The problem is on the focus of inputs of type text, when I click on any of these inputs, the focus goes to some other part of the window, and I can't type anything, btab to go tout if I use the fields, it seems to work fine, I can type something, click the button and add the messages.

If I remove the winstore-jscompat include, it works fine (but In have to use MSApp.execUnsafeLocalFunction(function () { ...}); on everything MS says is unsafe).

If you want, you can find my test on:

http://1drv.ms/1BKmb2H

Regards,
Matheus

Performance issues

I'm having realy big issues with this shim specialy in performance situation, page changes with my angularjs takes on windows phone more then 3 seconds.
On the normal IE the page loads within 1 second.
I attached my app on visual studio and tried an performance test, and about 6.5% is just taking the winstore-jscompat.js
Any ideas of speeding up?
Specialy the cleanse is taking up 5.1%
Setup: Cordova 6.3, Windows Phone 8.1/10 - .appx, AngularJs 1.5.5 and jQuery 2.2
Thanks in advance
Graphefruit
image

BUG: Navigation-App stays within the splash screen ...

Windows 10 Technical Preview for Enterprise,
VS Express 2013

New Project "Navigation-App (Windows)",
in "default.html" including

<script src="/js/winstore-jscompat.js"></script>

prevents the error message as desired,
but as a side effect the navigation stays within the splash screen ...
=> There ist no navigation switching to "home.html".

part of default.html:
...
<script src="/js/default.js"></script>
<script src="/js/navigator.js"></script>

<script src="/js/winstore-jscompat.js"></script>
<!-- script src="/js/jquery-2.1.1.js"></script -->

...

Since i just started with Windows Store Apps, i could not provide the solution,
i am sorry for that,
Regards, Wolfgang

Image and SVG image files are not loading properly.

Hi All,

I have referred this winstore-jscompat script file, now the navigation between pages are working fine. But images and svg images are not loading properly.

Could you please let me know if you have any solutions?.

Regards,
Bharathi D

Issue with Windows 8 App - Cordova OAuth2 opening Iframe or Redirect

Hi,
I have been putting some code together with the objective to get the code to to work on all of the visual studio tools device emulators. So far this has been great, the only device that I am struggling to get working is the windows app simulator. So what the application does is its a Facebook Login using hello.js. I have a landing page and a login to Facebook button. When I click on the login button on all the other device simulators / emulators everything works great, I can either open the Facebook request in a popup or in the same screen. When I try this on a windows 8 app however the emulator seems to just loose focus from the app. (maybe trying to launch a browser)
So what I have tried is appending ms-appx:/// to the authorization url, looked something like this:
oauth : {
version : 2.3,
auth: 'ms-appx:///https://www.facebook.com/dialog/oauth/',
grant: 'ms-appx:///https://graph.facebook.com/oauth/access_token'
},
What happens now is that the app no longer looses focus but the content is a blank white page. I have also tried adding winstore-jscompat.js before the first script run but still getting the same result.

Any help would be appreciated. Thanks :)

angular [object Object] in Angular WinPhone app

Hi,

I am writing because the last couple of days I am trying to setup a windows phone app to work with angular. When I am including the winstore-jscompat it seems to work. The issue I have is that instead of actual html in angular views I have the string [object Object].

Do you have any idea why this can happen?
Any help is greatly appreciated.

Cheers,
Radu

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.