Skip to content

feat: testing branch for ESM-only packages [] #1526

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
aodhagan-cf wants to merge 16 commits into
base: feat/esm-only
Choose a base branch
from
Draft

feat: testing branch for ESM-only packages [] #1526

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
ad55bf2
feat: moving the json editor to esm only []
aodhagan-cf Oct 27, 2023
1e6cdb6
chore: esm only boolean
YvesRijckaert Oct 27, 2023
2f12c99
fix: shared field editors
YvesRijckaert Oct 27, 2023
fd7ac2c
chore: fixing boolean tests, breaking everything else []
aodhagan-cf Oct 27, 2023
0f4aad5
chore: fixing boolean tests, breaking everything else []
aodhagan-cf Oct 27, 2023
4567469
chore: fixing test configs []
aodhagan-cf Oct 27, 2023
36bf283
feat: migrating checkbox to esm-only []
aodhagan-cf Oct 27, 2023
e9dfe95
feat: migrating date editor to esm-only []
aodhagan-cf Oct 27, 2023
5b4289e
feat: migrating dropdown editor to esm-only []
aodhagan-cf Oct 27, 2023
103c147
feat: migrating list editor to esm-only []
aodhagan-cf Oct 27, 2023
36a57f0
feat: migrating location editor to esm-only []
aodhagan-cf Oct 27, 2023
f190274
chore: migrating markdown to esm-only []
aodhagan-cf Oct 27, 2023
162268f
chore: migrating multiple-line to esm-only []
aodhagan-cf Oct 27, 2023
3472fa9
chore: migrating number editor to esm-only []
aodhagan-cf Oct 27, 2023
df4b3ff
chore: migrating radio editor to esm-only []
aodhagan-cf Oct 27, 2023
cb270e1
chore: migrating rating editor to esm-only []
aodhagan-cf Oct 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions .storybook/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,18 @@ const config: StorybookConfig = {
docs: {
autodocs: false,
},
webpackFinal: async (config) => {
const customConfig = { ...config };

if (!customConfig.resolve) {
customConfig.resolve = {};
}

customConfig.resolve.extensionAlias = {
'.js': ['.tsx', '.ts', '.js'],
};
return customConfig;
},
};

export default config;
3 changes: 2 additions & 1 deletion .swcrc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,8 @@
}
},
"module": {
"type": "es6"
"type": "es6",
"strict": false
},
"minify": false
}
29 changes: 29 additions & 0 deletions baseESMJestConfig.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
/* eslint-disable */

function getConfig(packageName) {
return {
testEnvironment: 'jsdom',
modulePathIgnorePatterns: ['<rootDir>/dist/'],
testMatch: ['**/?(*.)+(spec|test).[jt]s?(x)'],
extensionsToTreatAsEsm: ['.ts', '.tsx'],
moduleNameMapper: {
'^(\\.\\.?\\/.+)\\.js$': '$1',
},
transform: {
'^.+\\.tsx?$': ['@swc/jest'],
},
reporters: [
'default',
[
'jest-junit',
{
outputDirectory: '../../reports',
outputName: `${packageName}-results.xml`,
addFileAttribute: true,
},
],
],
};
}

module.exports = getConfig;
4 changes: 4 additions & 0 deletions baseJestConfig.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@ function getConfig(packageName) {
testEnvironment: 'jsdom',
modulePathIgnorePatterns: ['<rootDir>/dist/'],
testMatch: ['**/?(*.)+(spec|test).[jt]s?(x)'],
// for esm imports with .js extensions
moduleNameMapper: {
'^(\\.\\.?\\/.+)\\.js$': '$1',
},
reporters: [
'default',
[
Expand Down
0 packages/json/.eslintrc.js → packages/json/.eslintrc.cjs
View file
Open in desktop
File renamed without changes.
9 changes: 4 additions & 5 deletions packages/json/jest.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
/* eslint-disable */
const baseConfig = require('../../baseESMJestConfig.js');

const baseConfig = require('../../baseJestConfig');
const packageJSON = require('./package.json');
const packageName = packageJSON.name.split('@contentful/')[1];
Copy link
Contributor

@chrishelgert chrishelgert Oct 27, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NIT: depending on your preference

Suggested change
const packageName = packageJSON.name.split('@contentful/')[1];
const packageName = packageJSON.name.replace('@contentful/', '');


const package = require('./package.json');
const packageName = package.name.split('@contentful/')[1];

module.exports = {
export default {
...baseConfig(packageName),
};
21 changes: 6 additions & 15 deletions packages/json/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,9 @@
{
"name": "@contentful/field-editor-json",
"version": "3.3.6",
"main": "dist/cjs/index.js",
"module": "dist/esm/index.js",
"type": "module",
"main": "dist/esm/index.js",
Copy link
Contributor

@andipaetzold andipaetzold Oct 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This package stores the files in dist/esm while boolean stores them in dist directly. Can we align the setups?

Copy link
Contributor Author

@aodhagan-cf aodhagan-cf Oct 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

makes sense will do!

"types": "dist/types/index.d.ts",
"exports": {
Copy link
Contributor

@chrishelgert chrishelgert Oct 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need them or not?
I saw some post where it was mentioned that it was required for pure esm
other post are not mentioning them

Copy link
Contributor Author

@aodhagan-cf aodhagan-cf Oct 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@andipaetzold going to tag you on this comment if that's okay? I don't think we need it, I've tested this in the web app and it works, but have also seen some articles recommending to have it in

Copy link
Contributor

@andipaetzold andipaetzold Oct 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, we don't need it

".": {
"types": "./dist/types/index.d.ts",
"require": "./dist/cjs/index.js",
"default": "./dist/esm/index.js"
},
"./package.json": "./package.json"
},
"files": [
"dist"
],
Expand All @@ -23,12 +15,10 @@
},
"scripts": {
"watch": "yarn concurrently \"yarn:watch:*\"",
"watch:cjs": "yarn build:cjs -w",
"watch:esm": "yarn build:esm -w",
"watch:types": "yarn build:types --watch",
"build": "yarn build:types && yarn build:cjs && yarn build:esm",
"build": "yarn build:types && yarn build:esm",
"build:types": "tsc --outDir dist/types --emitDeclarationOnly",
"build:cjs": "swc src --config-file ../../.swcrc -d dist/cjs -C module.type=commonjs",
"build:esm": "swc src --config-file ../../.swcrc -d dist/esm",
"tsc": "tsc -p ./ --noEmit"
},
Expand All @@ -38,13 +28,14 @@
"@contentful/f36-tokens": "^4.0.0",
"@contentful/field-editor-shared": "^1.4.2",
"@types/deep-equal": "1.0.1",
"@types/react-codemirror": "1.0.3",
"@uiw/react-codemirror": "^4.11.4",
"@types/react-codemirror": "1.0.10",
"@uiw/react-codemirror": "^4.21.20",
"deep-equal": "2.2.2",
"emotion": "^10.0.17",
"lodash": "^4.17.15"
},
"devDependencies": {
"@types/lodash-es": "4.17.9",
"@contentful/field-editor-test-utils": "^1.4.3"
},
"peerDependencies": {
Expand Down
12 changes: 6 additions & 6 deletions packages/json/src/JsonEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@ import * as React from 'react';

import { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';
import deepEqual from 'deep-equal';
import throttle from 'lodash/throttle';
import throttle from 'lodash-es/throttle.js';

import { JsonEditorField } from './JsonEditorField';
import { JsonEditorToolbar } from './JsonEditorToolbar';
import { JsonInvalidStatus } from './JsonInvalidStatus';
import { JSONObject } from './types';
import { stringifyJSON, parseJSON, SPACE_INDENT_COUNT } from './utils';
import { JsonEditorField } from './JsonEditorField.js';
import { JsonEditorToolbar } from './JsonEditorToolbar.js';
import { JsonInvalidStatus } from './JsonInvalidStatus.js';
import { JSONObject } from './types.js';
import { stringifyJSON, parseJSON, SPACE_INDENT_COUNT } from './utils.js';

export interface JsonEditorProps {
/**
Expand Down
5 changes: 3 additions & 2 deletions packages/json/src/JsonEditorField.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@ import { json } from '@codemirror/lang-json';
import { indentUnit } from '@codemirror/language';
import { EditorView } from '@codemirror/view';
import tokens from '@contentful/f36-tokens';
import CodeMirror from '@uiw/react-codemirror';
import CodeMirror from '@uiw/react-codemirror/esm/index.js';
Copy link
Contributor

@chrishelgert chrishelgert Oct 27, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

❓ why do we need to import from esm
Shouldn't be automatically detected?

import { css, cx } from 'emotion';

import { SPACE_INDENT_COUNT } from './utils';
import { SPACE_INDENT_COUNT } from './utils.js';

type JsonEditorFieldProps = {
isDisabled: boolean;
Expand Down Expand Up @@ -60,6 +60,7 @@ export function JsonEditorField(props: JsonEditorFieldProps) {
className={cx(styles.root, { disabled: props.isDisabled })}
data-test-id="json-editor-code-mirror"
>
{/* @ts-expect-error */}
<CodeMirror
value={props.value}
onChange={props.onChange}
Expand Down
2 changes: 1 addition & 1 deletion packages/json/src/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
import JsonEditor from './JsonEditor';
import JsonEditor from './JsonEditor.js';

export { JsonEditor };
2 changes: 1 addition & 1 deletion packages/json/src/utils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { JSONObject } from './types';
import { JSONObject } from './types.js';

export const SPACE_INDENT_COUNT = 4;

Expand Down
4 changes: 2 additions & 2 deletions packages/json/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
"extends": "../../tsconfig.json",
"include": ["src", "types"],
"compilerOptions": {
"module": "esnext",
"moduleResolution": "bundler",
"module": "Node16",
"moduleResolution": "Node16",
"lib": ["dom", "esnext"],
"rootDir": "./src",
"baseUrl": "./",
Expand Down
38 changes: 25 additions & 13 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7700,6 +7700,18 @@
dependencies:
"@types/node" "*"

"@types/[email protected]":
version "4.17.9"
resolved "https://registry.yarnpkg.com/@types/lodash-es/-/lodash-es-4.17.9.tgz#49dbe5112e23c54f2b387d860b7d03028ce170c2"
integrity sha512-ZTcmhiI3NNU7dEvWLZJkzG6ao49zOIjEgIE0RgV7wbPxU0f2xT3VSAHw2gmst8swH6V0YkLRGp4qPlX/6I90MQ==
dependencies:
"@types/lodash" "*"

"@types/lodash@*":
version "4.14.200"
resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.200.tgz#435b6035c7eba9cdf1e039af8212c9e9281e7149"
integrity sha512-YI/M/4HRImtNf3pJgbF+W6FrXovqj+T+/HpENLTooK9PnkacBsDpeP3IpHab40CClUfhNmdM2WTNP2sa2dni5Q==

"@types/[email protected]":
version "4.14.168"
resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.168.tgz#fe24632e79b7ade3f132891afff86caa5e5ce008"
Expand Down Expand Up @@ -7854,10 +7866,10 @@
dependencies:
"@types/react" "*"

"@types/[email protected].3":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@types/react-codemirror/-/react-codemirror-1.0.3.tgz#5b0e4d5529a6bc934e992c49f3d1fa77daacc59b"
integrity sha512-EAyys2Wpys7bJatgnfpXXs4Gi1Vktj23mNngG4Ex2Q0W6eVgfkP4GP7qHyDVU2wbW3T0K7Jqatf2dCob25ptMw==
"@types/[email protected].10":
version "1.0.10"
resolved "https://registry.yarnpkg.com/@types/react-codemirror/-/react-codemirror-1.0.10.tgz#980fe0d560a00874edef45e36ab8b1de35ee6df9"
integrity sha512-0QfiTtSnGHuiyfd3NBPOqJGaeBIntl975In/Iv5FLwvVpcheEFBb/QZSPvR0MGb2TFJYuHa5tJrRfrBKxk+dGg==
dependencies:
"@types/codemirror" "*"
"@types/react" "*"
Expand Down Expand Up @@ -8641,10 +8653,10 @@
immer "^9.0.6"
react-tracked "^1.7.9"

"@uiw/codemirror-extensions-basic-setup@4.20.2":
version "4.20.2"
resolved "https://registry.yarnpkg.com/@uiw/codemirror-extensions-basic-setup/-/codemirror-extensions-basic-setup-4.20.2.tgz#25c098c9984403955498d996435c43941507a039"
integrity sha512-8oF7ICSEoJVjn9MNKLsY5BaxGsFS/Qh8AMHa/0hZP1fExeI+LKhaaSfHbdRk8RpYE5Ffjtx+tBQfh22YBiv5dQ==
"@uiw/codemirror-extensions-basic-setup@4.21.20":
version "4.21.20"
resolved "https://registry.yarnpkg.com/@uiw/codemirror-extensions-basic-setup/-/codemirror-extensions-basic-setup-4.21.20.tgz#9dbfab401a3168312c3f1d908b0f9b280410c206"
integrity sha512-Wyi9q4uw0xGYd/tJ6bULG7tkCLqcUsQT0AQBfCDtnkV3LdiLU0LceTrzJoHJyIKSHsKDJxFQxa1qg3QLt4gIUA==
dependencies:
"@codemirror/autocomplete" "^6.0.0"
"@codemirror/commands" "^6.0.0"
Expand All @@ -8654,16 +8666,16 @@
"@codemirror/state" "^6.0.0"
"@codemirror/view" "^6.0.0"

"@uiw/react-codemirror@^4.11.4":
version "4.20.2"
resolved "https://registry.yarnpkg.com/@uiw/react-codemirror/-/react-codemirror-4.20.2.tgz#e429821b0c5fb572e50ab38329086a79cd7f908f"
integrity sha512-Rf6i9HgtNnYAVRBb1gfWlhiiOBrEPuIfHLn87cV9XPpjP+YtqZoP6VMMlMq4XFTbZ/E1GIxnSUgJMQToTth0iw==
"@uiw/react-codemirror@^4.21.20":
version "4.21.20"
resolved "https://registry.yarnpkg.com/@uiw/react-codemirror/-/react-codemirror-4.21.20.tgz#bbfb57676c9939d880de6c7223c2ed7410271145"
integrity sha512-PdyewPvNXnvT3JHj888yjpbWsAGw5qlxW6w1sMdsqJ0R6vPV++ob1iZXCGrM1FVpbqPK0DNfpXvjzp2gIr3lYw==
dependencies:
"@babel/runtime" "^7.18.6"
"@codemirror/commands" "^6.1.0"
"@codemirror/state" "^6.1.1"
"@codemirror/theme-one-dark" "^6.0.0"
"@uiw/codemirror-extensions-basic-setup" "4.20.2"
"@uiw/codemirror-extensions-basic-setup" "4.21.20"
codemirror "^6.0.0"

"@ungap/[email protected]":
Expand Down