reactjs - @fluentui v8 升级 Jest 更新 TypeError: react_hooks_1.useMergedRefs is not a function

Question

我正在努力将我们当前的代码库从office-fabric-ui-reactv7 升级到 v8 aka @fluentui/react。在 fluentui 升级之前，所有测试都在工作。

代码库适用于更新。开玩笑的测试套件是失败的。我正在使用 lerna monoreop。

面板.test.tsx

import { PanelSize } from '@demo/utilities';
import { Panel } from '@fluentui/react';
import { configure, shallow } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import React from 'react';
import renderer from 'react-test-renderer';
import { Update } from '../../../__testUtils__/TestUtils';
import { DemoPanel } from '../Panel';
import { IDemoPanelProps } from '../DemoPanel.types';

describe('Demo Panel Tests', function () {
    test('test custom panel telemetry', async function () {
        let tree: renderer.ReactTestRenderer;
        renderer.act(() => {
            tree = renderer.create(
                <DemoPanel
                    titleText={'Custom'}
                    isOpen={true}
                >
                    This is a default size panel.
                </DemoPanel>
            );
        });

        expect(tree!.toJSON()).toMatchSnapshot();
    });
}

包.json

{
  "name": "@demo/controls",
  "version": "4.0.0",
  "author": "Demo author",
  "description": "Engineering.",
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": ""
  },
  "main": "lib-commonjs/index.js",
  "module": "lib/index.js",
  "files": [
    "lib*"
  ],
  "just": {
    "stack": "just-stack-single-lib"
  },
  "sideEffects": false,
  "typings": "lib/index.d.ts",
  "scripts": {
    "build": "just-scripts build",
    "clean": "just-scripts clean",
    "just": "just-scripts",
    "lint-fix": "yarn lint --fix",
    "lint": "eslint . --ext .ts,.tsx",
    "start-test": "just-scripts start-test",
    "start": "just-scripts start",
    "test-update": "just-scripts jest-update",
    "test": "just-scripts test",
    "update-snapshots": "just-scripts jest -u",
    "upgrade-stack": "just-scripts upgrade-stack"
  },
  "dependencies": {
    "@demo/panel": "1.2.0",
    "@demo/telemetry": "2.2.0",
    "@demo/utilities": "1.5.0",
    "@demo/styles": "1.3.1",
    "@fluentui/font-icons-mdl2": "^8.1.14",
    "@fluentui/react-charting": "^5.3.61",
    "@fluentui/react": "^8.37.6",
    "@fluentui/scheme-utilities": "^8.2.4",
    "@fluentui/style-utilities": "^8.3.4",
    "@fluentui/theme": "^2.4.1",
    "@fluentui/utilities": "^8.3.4",
    "dayjs": "^1.10.7",
    "react-export-excel": "^0.5.3",
    "react-grid-layout": "^0.18.3",
    "react-html-parser": "^2.0.2",
    "react-innertext": "1.1.5",
    "react-resize-detector": "^6.7.6",
    "resize-observer-polyfill": "^1.5.1",
    
  },
  "peerDependencies": {
    "@fluentui/react": "^8.37.6",
    "dayjs": "^1.10.7",
    "moment": "^2.29.1",
    "moment-timezone": "^0.5.33",
    "react": "^16.8.5",
    "react-dom": "^16.8.5",
    "tslib": "^2.3.1"
  },
  "devDependencies": {
    "@babel/core": "^7.15.5",
    "@babel/plugin-transform-modules-commonjs": "^7.15.4",
    "@babel/preset-react": "^7.16.0",
    "@fluentui/jest-serializer-merge-styles": "^8.0.11",
    "@types/jest": "^26.0.24",
    "@types/node": "^10.17.60",
    "@types/react-dom": "^16.8.5",
    "@types/react-grid-layout": "^1.1.2",
    "@types/react-html-parser": "^2.0.2",
    "@types/react-test-renderer": "16.8.0",
    "@types/react": "^16.3.13",
    "@typescript-eslint/eslint-plugin": "^4.5.0",
    "@typescript-eslint/parser": "^4.32.0",
    "babel-jest": "^26.6.3",
    "dayjs": "^1.10.7",
    "eslint-config-react": "^1.1.7",
    "eslint-plugin-react": "^7.26.0",
    "eslint": "^7.32.0",
    "jest-cli": "^26.6.3",
    "jest": "26.6.0",
    "moment-timezone": "^0.5.33",
    "moment": "^2.29.1",
    "react-innertext": "1.1.5",
    "react-test-renderer": "16.8.0",
    "ts-jest": "^26.5.6",
    "tslib": "^2.3.1",
    "typescript": "^3.9.10"
  }
}

标签： reactjstypescriptreact-hooksts-jestfluent-ui