javascript - meteor 撞击 Safari

Question

我在我的 meteor 应用程序中遇到了一个非常荒谬的错误。本质上，我有一个特定的页面，它呈现一些模板，在 Mac 上使 Safari 崩溃，并且只有 Safari(并且仅当控制台未打开时)。

我已经(在某种程度上)将其缩小到似乎有助于解决问题的场景。删除下面列出的“floorList”模板上的事件处理。如有任何想法、问题和建议，我们将不胜感激。

我知道在没有看到所有内容的情况下很难说，但这里是大致的设置:

我们正在使用 iron-router，主要模板加载:

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

我们的“yield”是一个模板:

<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 包装每个语句中的模板似乎解决了这个问题。为什么会这样？

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

Answer 1

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

在 IE9 的情况下，通常只有在未包含 html5 填充程序时才会观察到此错误，并且该错误是由于 IE9 由于缺少网络而无法正确呈现和解释数据的结果-kit 和 html5 兼容性，如果包含 shim，问题通常是 IE9 兼容模式设置。

在 Safari 的情况下，问题类似，但不相同，Safari 原生支持 html5 以及 web-kit 样式格式这里的问题是 Safari 中处理数据的方式的一个错误，你实际上是给它一个项目列表，但它无法连续附加到主 div，通过将它封装在它自己的子 div 中，你给了它一个更好的命名空间以及更清晰的渲染位置，我不知道这是苹果内部安全设置的结果还是只是一般的渲染错误，但问题确实出在 Safari 而不是 Meteor