Полимер не работает должным образом в Firefox

Я пытаюсь интегрировать Polymer с Rails 4, используя polymer-rails и polymer-paper-rails Драгоценные камни.

Кажется, у меня много проблем с отображением каких-либо элементов в Firefox. Оглядевшись вокруг и довольно много поискав в Google, я пришел к выводу, что проблема, должно быть, связана с моим файлом platfom.js.

Я точно следовал инструкциям по установке обоих вышеупомянутых драгоценных камней и действительно не знаю, что я делаю неправильно. Бумажные элементы отлично работают в Google Chrome.

В моей консоли разработчика Firefox я вижу сообщение

«platform.js — не первый скрипт на странице. См. http://www.polymer-project.org/docs/start/platform.html#setup для получения подробной информации». платформа.js: 12".

Вот как выглядит мой файл application.js:

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.

//= require jquery
//= require jquery_ujs
//= require foundation
//= require turbolinks
//= require_tree .
//= require elements/ripple
//= require forms/select

$(function(){ $(document).foundation(); });

Раздел моего HTML выглядит так:

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title><%= content_for?(:title) ? yield(:title) : "foundation-rails" %></title>

    <%= javascript_include_tag 'polymer/platform' %>

    <%= stylesheet_link_tag    "application" %>
    <%= html_import_tag 'application'%>
    <%= javascript_include_tag "vendor/modernizr" %>
    <%= csrf_meta_tags %>
</head>

person HermannHH    schedule 13.10.2014    source источник
comment
Проверьте консоль разработчика в Firefox — какие ошибки вы видите?   -  person Nevir    schedule 14.10.2014
comment
Ваш вывод, скорее всего, правильный. Наиболее вероятная проблема, из-за которой все работает в Chrome, но не в других браузерах, заключается в том, что полимер.js не включен на вашу страницу. Без дополнительной информации, хотя нам трудно отладить это с вами. Можете ли вы проверить обслуживаемый javascript в поисках платформы?   -  person Peter Burns    schedule 14.10.2014
comment
@Nevir, я обновил сообщение с кодом и консольным сообщением. Я думаю, что вы, ребята, на что-то наткнулись. Я изменил порядок операторов require в файле js, но это не сработало.   -  person HermannHH    schedule 14.10.2014
comment
Как выглядит ваш макет (или шаблон страницы)? platform.js делает несколько довольно навязчивых вещей, чтобы убедиться, что все правильно полифилировано. Убедитесь, что вы не включаете какие-либо другие сценарии перед ним.   -  person Nevir    schedule 14.10.2014
comment
Возможно, вы захотите попробовать просто добавить <%= javascript_include_tag 'polymer/platform' %> вверху вашего head, а не класть его в комплект звездочек (не идеальный вариант, но, по крайней мере, может помочь в диагностике)   -  person Nevir    schedule 14.10.2014
comment
@Nevir ... Спасибо, я могу подтвердить, что приведенное выше предложение удалило исходное сообщение об ошибке. Однако он представил следующее сообщение mutating the [[Prototype]] of an object will cause your code to run very slowly; instead create the object with the correct initial [[Prototype]] value using Object.create, и компоненты по-прежнему не отображаются правильно.   -  person HermannHH    schedule 14.10.2014
comment
Похоже на проблему с атрибутом title. Вы должны либо переименовать атрибут, либо скачать версию polymer.js для разработчиков.   -  person Aleksei Matiushkin    schedule 17.10.2014


Ответы (1)


Документация platform.js кажется устаревшей (относится к версии Polymer 0.5)

Для совместимости с браузерами, которые не полностью поддерживают веб-компоненты, вы должны включить

//= require webcomponentsjs/webcomponents-lite

После этого вы должны увидеть компоненты в FF/Safari так же, как в Chrome.

person 0Ds0    schedule 17.08.2015