Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
…o improve-treeshakeability
  • Loading branch information
aryaemami59 committed Jul 25, 2024
2 parents b004462 + e33130e commit a3874b8
Show file tree
Hide file tree
Showing 127 changed files with 6,710 additions and 1,585 deletions.
54 changes: 54 additions & 0 deletions .github/workflows/tests.yml
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,60 @@ jobs:
TEST_DIST: true
run: yarn test

- name: Run type tests with `moduleResolution Bundler`
run: rm -rf dist && yarn tsc -p . --moduleResolution Bundler --module ESNext --noEmit false --declaration --emitDeclarationOnly --outDir dist --target ESNext && rm -rf dist

test-type-portability:
name: Test Type Portability with TypeScript ${{ matrix.ts }} and Node.js ${{ matrix.node }}
needs: [build]
runs-on: ubuntu-latest
strategy:
fail-fast: false
matrix:
node: ['20.x']
ts: ['5.0', '5.1', '5.2', '5.3', '5.4', '5.5', 'next']
example:
[
{ name: 'bundler', moduleResolution: 'Bundler' },
{ name: 'nodenext-cjs', moduleResolution: 'NodeNext' },
{ name: 'nodenext-esm', moduleResolution: 'NodeNext' },
]
steps:
- name: Checkout repo
uses: actions/checkout@v4

- name: Use node ${{ matrix.node }}
uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node }}
cache: 'yarn'

- name: Install deps
run: yarn install

- uses: actions/download-artifact@v4
with:
name: package
path: packages/toolkit

- name: Install build artifact
run: yarn workspace @examples-type-portability/${{ matrix.example.name }} add $(pwd)/package.tgz

- name: Install TypeScript ${{ matrix.ts }}
run: yarn workspace @examples-type-portability/${{ matrix.example.name }} add -D typescript@${{ matrix.ts }}

- name: Test type portability with `moduleResolution ${{ matrix.example.moduleResolution }}`
run: yarn workspace @examples-type-portability/${{ matrix.example.name }} run test

- name: Test type portability with `moduleResolution Node10`
run: yarn workspace @examples-type-portability/${{ matrix.example.name }} run test --module CommonJS --moduleResolution Node10 --preserveSymLinks --verbatimModuleSyntax false

- name: Test type portability with `moduleResolution Node10` and `type module` in `package.json`
if: matrix.example.name == 'nodenext-esm' || matrix.example.name == 'bundler'
run: |
npm --workspace=@examples-type-portability/${{ matrix.example.name }} pkg set type=module
yarn workspace @examples-type-portability/${{ matrix.example.name }} run test --module ESNext --moduleResolution Node10 --preserveSymLinks --verbatimModuleSyntax false
test-types:
name: Test Types with TypeScript ${{ matrix.ts }}

Expand Down
37 changes: 32 additions & 5 deletions .yarn/patches/console-testing-library-npm-0.6.1-4d9957d402.patch
Original file line number Diff line number Diff line change
@@ -1,11 +1,38 @@
diff --git a/package.json b/package.json
index b924e066ecfdb30917b9c1056b360834da357698..15e155bd84f9d16537ffe36f9a87debcb0ec3591 100644
--- a/package.json
+++ b/package.json
@@ -8,12 +8,15 @@
"type": "module",
"main": "dist/index.js",
"typings": "index.d.ts",
+ "types": "index.d.ts",
"exports": {
".": {
+ "types": "./index.d.ts",
"require": "./dist/index.js",
"default": "./src/index.js"
},
"./pure": {
+ "types": "./pure.d.ts",
"require": "./dist/pure.js",
"default": "./src/pure.js"
}
diff --git a/pure.d.ts b/pure.d.ts
index b13bb4eb87d0b316bb51bd6094b2353c6fc8527d..ee01cc9bd3233f5e67b050d48e22202b495a4a0a 100644
--- a/pure.d.ts
+++ b/pure.d.ts
@@ -1 +1 @@
-export * from './';
+export * from './index.js';
diff --git a/src/index.js b/src/index.js
index 90ff7fa3d7d4fa62dbbf638958ae4e28abd089a8..28434687b5163b7472e86bdb11bed69e0868e660 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,4 +1,4 @@
-import { mockConsole, createConsole } from './pure';
+import { mockConsole, createConsole } from './pure.js';

// Keep an instance of the original console and export it
const originalConsole = global.console;
diff --git a/src/pure.js b/src/pure.js
Expand All @@ -15,7 +42,7 @@ index b00ea2abbaea833e336676aa46e7ced2d59d6d88..42b83ed83fa16cf2234571500fe09868
@@ -228,10 +228,11 @@ export function restore() {
global.console = global.originalConsole;
}

+/*
if (typeof expect === 'function' && typeof expect.extend === 'function') {
expect.extend({
Expand All @@ -24,13 +51,13 @@ index b00ea2abbaea833e336676aa46e7ced2d59d6d88..42b83ed83fa16cf2234571500fe09868
+ // Workaround for custom inline snapshot matchers
const error = new Error();
const stacks = error.stack.split('\n');

@@ -245,7 +246,6 @@ if (typeof expect === 'function' && typeof expect.extend === 'function') {
error.stack = stacks.join('\n');

const context = Object.assign(this, { error });
- /* -------------------------------------------------------------- */

const testingConsoleInstance =
(received && received.testingConsole) || received;
@@ -270,3 +270,4 @@ if (typeof expect === 'function' && typeof expect.extend === 'function') {
Expand Down
42 changes: 42 additions & 0 deletions examples/type-portability/bundler/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
{
"name": "@examples-type-portability/bundler",
"private": true,
"version": "1.0.0",
"description": "testing type portability for moduleResolution Bundler",
"keywords": [],
"main": "src/index.tsx",
"dependencies": {
"@reduxjs/toolkit": "workspace:^",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-redux": "^9.1.2",
"react-router-dom": "^6.25.1",
"react-scripts": "5.0.1"
},
"devDependencies": {
"@types/node": "^20.14.11",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"typescript": "^5.5.4"
},
"eslintConfig": {
"extends": [
"react-app"
],
"rules": {
"react/react-in-jsx-scope": "off"
}
},
"scripts": {
"clean": "rm -rf dist",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "yarn clean && tsc -p tsconfig.json"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
36 changes: 36 additions & 0 deletions examples/type-portability/bundler/src/App.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import { Link, Route, Routes } from 'react-router-dom'
import { Lazy } from './features/bundleSplitting'
import { CounterList } from './features/counter/CounterList'
import { PollingToggles } from './features/polling/PollingToggles'
import { PostsManager } from './features/posts/PostsManager'
import { TimeList } from './features/time/TimeList'

export function App() {
return (
<div className="App">
<div className="row">
<div className="column column1">
<span>
<Link to="/">Times</Link> | <Link to="/posts">Posts</Link> |{' '}
<Link to="/counters">Counter</Link> |{' '}
<Link to="/bundleSplitting">Bundle Splitting</Link>
</span>
</div>
<div className="column column1">
<PollingToggles />
</div>
</div>
<div />
<div>
<Routes>
<Route path="/" element={<TimeList />} />
<Route path="/counters" element={<CounterList />} />
<Route path="/posts/*" element={<PostsManager />} />
<Route path="/bundleSplitting" element={<Lazy />} />
</Routes>
</div>
</div>
)
}

export default App
51 changes: 51 additions & 0 deletions examples/type-portability/bundler/src/app/customModule.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
import type {
Api,
BaseQueryFn,
CoreModule,
EndpointDefinitions,
Module,
} from '@reduxjs/toolkit/query'
import { buildCreateApi, coreModule } from '@reduxjs/toolkit/query'

export const customModuleName = Symbol('customModule')
export type CustomModule = typeof customModuleName

// If we remove this, We should get a TypeScript error.
declare module '@reduxjs/toolkit/query' {
export interface ApiModules<
BaseQuery extends BaseQueryFn,
Definitions extends EndpointDefinitions,
ReducerPath extends string,
TagTypes extends string,
> {
[customModuleName]: {
endpoints: {
[K in keyof Definitions]: {
myEndpointProperty: string
}
}
}
}
}

export const myModule = (): Module<CustomModule> => ({
name: customModuleName,
init(api, options, context) {
// initialize stuff here if you need to

return {
injectEndpoint(endpoint, definition) {
const anyApi = api as any as Api<
any,
Record<string, any>,
string,
string,
CustomModule | CoreModule
>
anyApi.endpoints[endpoint].myEndpointProperty = 'test'
},
}
},
})

export const myCreateApi = buildCreateApi(coreModule(), myModule())
10 changes: 10 additions & 0 deletions examples/type-portability/bundler/src/app/dynamicMiddleware.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { createDynamicMiddleware } from '@reduxjs/toolkit'

export const dynamicMiddleware = createDynamicMiddleware()

export const { addMiddleware, instanceId, middleware, withMiddleware } =
dynamicMiddleware

export const { withTypes, match, type } = withMiddleware

export const { withTypes: _withTypes } = addMiddleware
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import { createDynamicMiddleware } from '@reduxjs/toolkit/react'
import { listenerMiddleware } from './listenerMiddleware'

export const dynamicReactMiddleware = createDynamicMiddleware()

export const {
addMiddleware,
createDispatchWithMiddlewareHook,
createDispatchWithMiddlewareHookFactory,
instanceId,
middleware,
withMiddleware,
} = dynamicReactMiddleware

export const { withTypes } = addMiddleware

export const useDispatchWithMiddleware = createDispatchWithMiddlewareHook(
listenerMiddleware.middleware,
)
6 changes: 6 additions & 0 deletions examples/type-portability/bundler/src/app/hooks.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import { useDispatch, useSelector, useStore } from 'react-redux'
import type { AppDispatch, AppStore, RootState } from './store'

export const useAppDispatch = useDispatch.withTypes<AppDispatch>()
export const useAppSelector = useSelector.withTypes<RootState>()
export const useAppStore = useStore.withTypes<AppStore>()
10 changes: 10 additions & 0 deletions examples/type-portability/bundler/src/app/listenerMiddleware.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { createListenerMiddleware } from '@reduxjs/toolkit'

export const listenerMiddleware = createListenerMiddleware()

export const { clearListeners, middleware, startListening, stopListening } =
listenerMiddleware

export const { withTypes } = startListening

export const { withTypes: _withTypes } = stopListening
Loading

0 comments on commit a3874b8

Please sign in to comment.