流星撞击Safari

Question

我在流星应用程序中遇到了一个令人难以置信的荒谬错误.基本上,我有一个特定的页面,它会渲染一些模板,在Mac上崩溃Safari,而且只有Safari(并且只有当控制台未打开时).

我已经(稍微)将其缩小到一个似乎有助于解决问题的场景.删除下面列出的'floorList'模板上的事件处理.任何想法,问题和建议将不胜感激.

我知道很难说没有看到一切,但这里大致是设置:

我们正在使用铁路由器,主模板加载:

<template name="layout">
    <div id="pageWrap">
        {{> yield}}
    </div>
</template>

我们的"收益率"是一个模板:

<template name="pageList">
    <div class="pages">
        {{#each pageWithRank}}
            {{> pageItem}}
        {{/each}}
    </div>
</template>

加载'pageItem'模板(限制返回10个项目)

<template name="pageItem">
    <div class="page">
      ...
    </div>
</template>

以及包含帮助程序和事件处理程序的"pageItem"js文件,例如:

Template.pageItem.helpers({
    ...
});

Template.pageItem.events({
    'click .shareable': function(e, template) {
        ...
    },
    'click .share': function(e, template) {
        ...
    },
    'click .removePage': function(e) {
        ...
    }
});

路由器配置:

var preloadSubscriptions = [];
preloadSubscriptions.push('notifications');
preloadSubscriptions.push('alerts');
preloadSubscriptions.push('myPages');

var mainYieldTemplates = {
    'footer': { to: 'footer' },
    'header': {to: 'header'}
};


Router.configure({
    layoutTemplate: 'layout',
    loadingTemplate: 'loading',
    yieldTemplates: mainYieldTemplates, 
    waitOn: function() {
        return _.map(preloadSubscriptions, function(sub) {
            if (typeof sub === 'object') {
                Meteor.subscribe(sub.subName, sub.subArguments);
            } else {
                Meteor.subscribe(sub);
            }
        });
    }
});

var coreSubscriptions = new SubsManager({
    cacheLimit: 10,
    expireIn: 1
});

pagesListController = RouteController.extend({
    template: 'pageList',
    increment: 10,
    limit: function() {
        return parseInt(this.params.pageLimit) || this.increment;
    },
    findOptions: function() {
        return {
            sort: this.sort,
            limit: this.limit()
        };
    },
    pages: function() {
        return Pages.find({}, this.findOptions());
    },
    data: function() {
        var hasMore = this.pages().count() === this.limit();
        return {
            pages: this.pages(),
            nextPath: hasMore ? this.nextPath() : null
        };
    },
    onBeforeAction: function() {
        return [
            coreSubscriptions.subscribe('pages', this.findOptions()),
            coreSubscriptions.subscribe('pagesListUsers', this.findOptions())
        ];
    }
});

我们目前在项目模板上使用了6个点击事件.即使它们是空白的,Safari也会崩溃,完全删除,Safari也没问题.

我是疯了还是做这个逻辑的错误？

编辑:这听起来也很疯狂,但是...通过将div中的模板包装在div中似乎解决了问题.为什么会这样？

{{#each pageWithRank}}
  <div>
    {{> pageItem}}
  </div>
{{/each}}

Answer 1

从个人经验和在 Safari 中对此问题的测试来看，这似乎不是 Meteor 的问题，而是 Safari Web 浏览器的问题。查看日志和高级调试功能，并考虑到该问题主要仅存在于 Safari 中，在某些情况下存在于 IE9 中，这是浏览器尝试将传输的数据呈现到页面的方式的问题。

在 IE9 的情况下，通常仅在不包含 html5 shim 的情况下才会观察到此错误，并且该错误是由于 IE9 缺少 Web-kit 导致无法正确呈现和解释数据而导致的。 html5 兼容性，如果包含 shim，则通常是 IE9 兼容模式设置问题。

在 Safari 的情况下，问题类似，但不一样，Safari 本身支持 html5 以及 web-kit 样式格式。这里的问题是 Safari 中处理数据的方式的一个错误，你本质上是在给它项目列表，但它无法连续附加到主 div，通过将其封装在自己的子 div 中，您可以为其提供更好的命名空间以供使用以及更清晰的渲染位置，但我不知道这是否是一个苹果内部安全设置的结果或者只是一般的渲染错误，但问题确实在于 Safari 而不是 Meteor