插件中导入插件模型或组件：测试失败

开发
1

您好，
我们正在使用 Discourse 版本 3.5.0。
我们有自己的插件，在其中我们覆盖了 Discourse 的各种元素并添加了自己的功能。

在此插件中，我们特别希望在 composer 的工具栏中添加一个事件添加图标。为此，我们需要导入：

  • 模型 DiscoursePostEventEvent，位于 plugins/discourse-calendar/assets/javascripts/discourse/models/discourse-post-event-event.js

  • 组件 PostEventBuilder，位于 plugins/discourse-calendar/assets/javascripts/discourse/components/modal/post-event-builder.js

此外，我们还编写了集成测试来测试我们插件中的功能，这些测试位于我们插件的 /test 目录下。

import { visit } from "@ember/test-helpers";
import { test } from "qunit";
import { acceptance } from "discourse/tests/helpers/qunit-helpers";

acceptance("TOTO", function (needs) {
  test("coopaname integration - composer", async function (assert) {
    await visit("/");
    assert.equal(1, 1, "OK");
  });
});

我们可以实现我们的目标，但无论导入方式如何，测试都会失败。

文件头部导入

当我们在文件头部使用 import 方法导入我们的模型和组件时：

import DiscoursePostEventEvent from "discourse/plugins/discourse-calendar/discourse/models/discourse-post-event-event";
import PostEventBuilder from "discourse/plugins/discourse-calendar/discourse/components/modal/post-event-builder";

执行时一切正常，但当我们运行测试时，它没有被执行。

image
image967×211 19.2 KB

image
image1070×223 36.8 KB

文件头部 require

当我们在文件头部使用 require 方法导入我们的模型和组件时：

const DiscoursePostEventEvent = require("discourse/plugins/discourse-calendar/discourse/models/discourse-post-event-event").default;
const PostEventBuilder = require("discourse/plugins/discourse-calendar/discourse/components/modal/post-event-builder").default;

执行时一切正常，但当我们运行测试时，它没有被执行。

image
image967×211 19.2 KB

image
image1041×218 29 KB

这与使用 import 时产生的结果相同。

文件体 require

当我们在函数体中使用 require 方法导入我们的模型和组件时：

import { withPluginApi } from "discourse/lib/plugin-api";

function initializeEventBuilder(api) {
  const DiscoursePostEventEvent =
     require("discourse/plugins/discourse-calendar/discourse/models/discourse-post-event-event").default;
  const PostEventBuilder =
     require("discourse/plugins/discourse-calendar/discourse/components/modal/post-event-builder").default;

  // ... rest of the code
}

export default {
  name: "add-custom-create-event-button",
  initialize(container) {
    withPluginApi(initializeEventBuilder);
  },
};

执行时一切正常，但当我们运行测试时，它失败了。

image
image982×417 65.4 KB

模型未找到。

总之，我们想知道如何从其他插件正确导入模型、组件等，以便我们可以运行集成测试。
谢谢！

2 个赞
2

你好 @Marine

看起来问题出在我们代码的 needs.settings 块中使用了错误的设置：

acceptance("Some tests", function (needs) {
  needs.settings({
    // This won't enable the right settings, so the calendar plugin won't be loaded, and the files we need won't be available
    // discourse_post_event_enabled: true, 
    // 
    // Enabling the calendar will solve the issue:
    calendar_enabled: true

    our_plugin_enabled: true
  });


  test("The test", async function (assert) {
    await visit("/");
    assert.equal(1, 1);
  });
});
3

嗯，这不属实。由于插件会覆盖事件表单，我们需要将 discourse_post_event_enabled 设置为 true。这回到了我们插件导入失败的初始情况。

有什么想法吗？

4

在 qunit 中测试插件时，我们仅加载该特定插件的 JS。这有助于避免多个插件相互交互时出现意外问题。它还有助于确保插件不会意外地依赖另一个插件。

在您的情况下，听起来这种交互是故意的，并且您始终期望用户启用 discourse-calendar。在这种情况下，您可以向 about.json 文件添加一些配置，这将使 discourse-calendar JS 在您自己的插件的测试中可用。这是一个示例：

^^ 在这种情况下，它添加了 discourse-assign。在您的情况下，您将使用 discourse-calendar。

4 个赞
5

谢谢！我不知道 about.json，它解决了问题。现在，轮到我们重新创建一个功能齐全的上下文了 :wink:

再次感谢！

2 个赞
6

您可能还对端到端测试的系统规格感兴趣。这样，测试将针对真实的 Discourse 服务器运行，您不必伪造所有核心网络请求和两个插件的网络请求。

缺点是它们速度慢得多。因此，如果可以的话，最好将任何单元/组件测试保留在 qunit 中。

2 个赞
7

谢谢你的建议！

我更习惯于系统规范，因为我通常使用 RSpec 或 Cucumber 来测试我的 Rails 应用程序 :slight_smile:

我会根据测试用例，看看使用 QUnit 或 RSpec 测试什么比较好。

目前，我已经成功复现了我们想要修复的前端 bug，所以我将更深入地研究 QUnit 测试。

2 个赞