npm 包 unexpected-resemble 使用教程

阅读时长 4 分钟读完

在前端开发过程中,我们经常需要测试图片是否相似,而 unexpected-resemble 可以帮助我们更轻松地实现图片比较和测试。

1. 安装 unexpected-resemble

我们可以通过 npm 包管理工具安装 unexpected-resemble ,命令如下:

2. 使用 unexpected-resemble

引入 unexpected-resemble

在使用 unexpected-resemble 之前,我们需要在测试文件中引入该模块。

API

unexpected-resemble API 提供了以下函数:

  • toResemble
  • toNotResemble
  • promiseToResemble
  • promiseNotToResemble

其中, toResemblepromiseToResemble 用于比较两张图片是否相似;toNotResemblepromiseNotToResemble 用于比较两张图片是否不相似。

示例代码

下面是一个使用 unexpected-resemble 的示例代码,以 Jest 测试框架为例。

-- -------------------- ---- -------
----- ------ - ----------------------
----- ------------------ - -------------------------------
----- -------- - ----------------------

-------------------------------

------------------ -- -- -
  -------------- ----- -- -- -
    ----- ------ - ---------------------------------
    ----- ------ - ---------------------------------

    ----- ---- - ----- -------------------------
      -----------------------------------
      - ------------- --- -
    --

    -------------------------------------------------------
  ---

  --------------- ----- -- -- -
    ----- ------ - ---------------------------------
    ----- ------ - ---------------------------------

    ----- ---- - ----- ----------------------------
      -----------------------------------
      - ------------- --- -
    --

    ---------------------------------------------------
  ---
---

代码解释如下:

  1. use 函数中添加了 unexpectedResemble 插件,用于支持图片比较。
  2. 在测试过程中,我们分别测试了两张图片是否相似和不相似。
  3. resemble 函数用于获取图片数据,通过 compareTo 函数比较两张图片之间的不同。
  4. promiseToResemblepromiseNotToResemble 函数用于进行异步测试,返回比较结果。
  5. 最后我们用 expect 函数进行断言,判断比较结果是否符合测试要求。

3. 总结

通过以上使用示例,我们可以看到,unexpected-resemble 包可以轻松地帮助我们实现图片的比较和测试,是一个非常有用的工具包。使用时,需要搭配其他图片处理工具一起使用,如 resemblejs 等。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/78339

纠错
反馈