酶中的接头是啥

Posted 2023-02-21

【中文标题】酶中的接头是啥

【英文标题】：what is adapter in enzyme酶中的接头是什么

【发布时间】：2019-08-16 02:02:40

【问题描述】：

关于adapter 在enzyme 测试库中的用途的任何文档。

import  configure  from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure( adapter: new Adapter() );

【问题讨论】：

npmjs.com/package/enzyme-adapter-react-16

我看了看，他们说的就是怎么安装，安装什么版本。

【参考方案1】：

关于adapter 在enzyme 测试库中的用途的任何文档。

最接近的是"You will need to install enzyme along with an Adapter corresponding to the version of react (or other UI Component library) you are using"。

文档大多只是解释如何配置adapter，并没有真正谈论它的用途。

---

什么是酶中的接头

---

短版

enzyme API 是相同的，与您使用的 React 版本无关，但 React 如何呈现以及与呈现的内容交互取决于React 版本。

adapter 抽象出任何基于React 版本的更改，因此核心enzyme 代码可以保持不变。

---

详细版

mount 和 shallow 都是 exported from enzyme。让我们关注mount。

mount 是 just returns a new ReactWrapper 的函数。

ReactWrapper 为熟悉的包装对象提供instance、setState、find 等。

无论您使用哪个版本的React，所有这些功能的实现都是相同的...

...但是因为 React 本身多年来发生了变化任何基于 React 版本而更改的实现细节都通过适配器抽象出来。

通过调用getAdapter检索适配器，第一次使用到validate the nodes passed to mount，然后到create the renderer to actually render the nodes。

对于enzyme-adapter-react-16.3，对createRenderer 的调用得到routed to this.createMountRenderer，在createMountRenderer 内，您可以看到the familiar ReactDOM.render call where what you passed is actually rendered using React v16 syntax。

---

在ReactWrapper.js 中搜索getAdapter 随处可见adapter 用于抽象出在使用mount 时根据React 版本更改的功能...

...在ShallowWrapper.js 中搜索getAdapter 会发现adapter 用于抽象出在使用shallow 时会根据React 版本更改的功能。

【讨论】：

是否可以说这里的适配器就像我们在 Windows 中安装的“驱动程序软件”。假设我有一个新的外部设备，所以我的操作系统不知道如何与该设备交互，除非操作系统中安装了该设备的正确驱动程序？另外，您能否提供一个实时示例，说明如果酶适配器不存在或相对于其 UI 库/框架的相应版本已过时，会发生什么情况？