JavaScript Dynamic Content shim для Windows JavaScript Apps

Посвящается разработчикам, которые пытались заставить популярные веб-фрейморки, такие как AngularJS, KnockoutJS, Ember.js и другие, работать внутри Windows Store JavaScript приложения, но столкнулись с непониманием рантайма в лице ошибки ниже.

Это такая фича, которая запрещает динамически модифицировать HTML/DOM контент, используя некоторые методы, делая приложения более секьюрными, но при этом делает невозможным использование более или менее сложных веб-фреймворков, которые активно используют такие фичи (например, innerHTML).

Решение есть

Прошу любить и жаловать — JavaScript Dynamic Content shim for Windows Store apps, специальная JS библиотека от Microsoft Open Technologies, которую достаточно включить в html файл.

Пример для AngularJS

1. Создаем Windows Store JavaScript приложение

2. Добавляем тестовое AngularJS приложение

Скачиваем исходный код github.com/ccoenraets/angular-directory. Читаем описание приложения, если нужно/интересно.

Переносим папку client как есть в только что созданное Windows Store приложение (Show All Files -> Include In Project).

3. Добавляем winstore-jscompat.js
Выкачиваем и добавляем winstore-jscompat.js в свой проект.

Не забываем включить библиотеку в client/index.html:

4. Выставляемый client/index.html в качестве стартовой страницы и запускаем

5. Финальный штрих

Видно, что приложение работает, но картинки не подгружаются. Это специальная логика AngularJS, которая помечает специфичный для Windows Store App ms-appx:// протокол как unsafe.