Ensure desktop plugin template tests run (#3039)

Summary:
I've decided to migrate [a desktop plugin](https://github.com/bamlab/react-native-performance) to Sandy.
When doing so, I decided to rise to the challenge from the [Flipper docs](https://fbflipper.com/docs/tutorial/js-custom#testing-plugin-logic):  `we are going to pretend that we always write unit tests first` 😅

However, I've realized that when creating a plugin with `npx flipper-pkg init`, running `yarn jest` directly after creation actually fails.

There are 3 issues solved in the different commits:
1. an absolute import seem to not be resolved, since all the other imports were relative in the file, I changed it as well

2. some dependencies are missing.
They used to be included in the `flipper` dependency but when migrating to use `flipper-plugin` instead, they're not present anymore.
I don't think this is an ideal fix, I would believe a dependency like a `flipper-dev-environment` including all of those would be more appropriate. So I'm open to suggestions to fix/remove of course

3. jest.config needs to be fixed to run in jsdom environment and ensure we can test the react component

## Changelog

Fix: ensure desktop plugin template tests run

Pull Request resolved: https://github.com/facebook/flipper/pull/3039

Test Plan:
I've cloned the repo and run:

```
cd flipper/desktop/pkg
yarn
cd ../../..
./flipper/desktop/pkg/bin/run init
```
I run the tests on the newly package created, but it actually still failed because of the first issue (since it still installed `flipper-plugin` from npm`)

However, by adding this patch, it now runs!
```patch
 diff --git a/node_modules/flipper-plugin/lib/ui/data-table/DataTable.js b/node_modules/flipper-plugin/lib/ui/data-table/DataTable.js
index 2e07ff5..ff3181d 100644
 --- a/node_modules/flipper-plugin/lib/ui/data-table/DataTable.js
+++ b/node_modules/flipper-plugin/lib/ui/data-table/DataTable.js
@@ -39,7 +39,7 @@ const useAssertStableRef_1 = require("../../utils/useAssertStableRef");
 const PluginContext_1 = require("../../plugin/PluginContext");
 const lodash_1 = require("lodash");
 const useInUnitTest_1 = require("../../utils/useInUnitTest");
-const createDataSource_1 = require("flipper-plugin/src/state/createDataSource");
+const createDataSource_1 = require("../../state/createDataSource");
 function DataTable(props) {
     var _a, _b;
     const { onRowStyle, onSelect, onCopyRows, onContextMenu } = props;
```

Reviewed By: aigoncharov

Differential Revision: D32358207

Pulled By: mweststrate

fbshipit-source-id: 7761b4150c24dd5379a24c3c1deeb78bf3dda4ee
This commit is contained in:
almouro
2021-11-11 12:06:31 -08:00
committed by Facebook GitHub Bot
parent 6bf3a4ff4c
commit 5b603ab976
3 changed files with 23 additions and 3 deletions

View File

@@ -51,7 +51,7 @@ import {Formatter} from '../DataFormatter';
import {usePluginInstanceMaybe} from '../../plugin/PluginContext';
import {debounce} from 'lodash';
import {useInUnitTest} from '../../utils/useInUnitTest';
import {createDataSource} from 'flipper-plugin/src/state/createDataSource';
import {createDataSource} from '../../state/createDataSource';
interface DataTableBaseProps<T = any> {
columns: DataTableColumn<T>[];