Skip to content

Commit bcd82bd

Browse files
onurtemizkanonurtemizkan
committed
test(remix): Add a boilerplate for Remix SDK integration tests.
1 parent f1cfc70 commit bcd82bd

File tree

18 files changed

+7310
-1
lines changed

18 files changed

+7310
-1
lines changed

‎.github/workflows/build.yml

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -571,3 +571,38 @@ jobs:
571571
run: |
572572
cd packages/node-integration-tests
573573
yarn test
574+
575+
job_remix_integration_tests:
576+
name: Remix SDK Integration Tests (${{ matrix.node }})
577+
needs: [job_get_metadata, job_build]
578+
runs-on: ubuntu-latest
579+
timeout-minutes: 10
580+
continue-on-error: true
581+
strategy:
582+
matrix:
583+
node: [14, 16, 18]
584+
steps:
585+
- name: Check out current commit (${{ needs.job_get_metadata.outputs.commit_label }})
586+
uses: actions/checkout@v2
587+
with:
588+
ref: ${{ env.HEAD_COMMIT }}
589+
- name: Set up Node
590+
uses: actions/setup-node@v1
591+
with:
592+
node-version: ${{ matrix.node }}
593+
- name: Check dependency cache
594+
uses: actions/cache@v2
595+
with:
596+
path: ${{ env.CACHED_DEPENDENCY_PATHS }}
597+
key: ${{ needs.job_build.outputs.dependency_cache_key }}
598+
- name: Check build cache
599+
uses: actions/cache@v2
600+
with:
601+
path: ${{ env.CACHED_BUILD_PATHS }}
602+
key: ${{ env.BUILD_CACHE_KEY }}
603+
- name: Run integration tests
604+
env:
605+
NODE_VERSION: ${{ matrix.node }}
606+
run: |
607+
cd packages/remix
608+
yarn test:integration

‎packages/node-integration-tests/utils/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -161,7 +161,7 @@ export async function runServer(testDir: string, serverPath?: string, scenarioPa
161161
});
162162

163163
const server = app.listen(port, () => {
164-
resolve();
164+
resolve('');
165165
setTimeout(() => {
166166
server.close();
167167
}, 4000);

‎packages/remix/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@
6060
"lint:eslint": "eslint . --cache --cache-location '../../eslintcache/' --format stylish",
6161
"lint:prettier": "prettier --check \"{src,test,scripts}/**/*.ts\"",
6262
"test": "run-s test:unit",
63+
"test:integration": "cd test/integration && yarn test",
6364
"test:unit": "jest",
6465
"test:watch": "jest --watch"
6566
},

‎packages/remix/test/integration/.eslintrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": ["@remix-run/eslint-config", "@remix-run/eslint-config/node"]
3+
}

‎packages/remix/test/integration/.gitignore

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
node_modules
2+
3+
/.cache
4+
/build
5+
/public/build
6+
.env

‎packages/remix/test/integration/app/entry.client.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { RemixBrowser, useLocation, useMatches } from '@remix-run/react';
2+
import { hydrate } from 'react-dom';
3+
import * as Sentry from '@sentry/remix';
4+
import { useEffect } from 'react';
5+
6+
Sentry.init({
7+
dsn: 'https://[email protected]/1337',
8+
tracesSampleRate: 1,
9+
integrations: [
10+
new Sentry.BrowserTracing({
11+
routingInstrumentation: Sentry.remixRouterInstrumentation(useEffect, useLocation, useMatches),
12+
}),
13+
],
14+
});
15+
16+
hydrate(<RemixBrowser />, document);

‎packages/remix/test/integration/app/entry.server.tsx

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import type { EntryContext } from '@remix-run/node';
2+
import { RemixServer } from '@remix-run/react';
3+
import { renderToString } from 'react-dom/server';
4+
import * as Sentry from '@sentry/remix';
5+
6+
Sentry.init({
7+
dsn: 'https://[email protected]/1337',
8+
tracesSampleRate: 1,
9+
});
10+
11+
export default function handleRequest(
12+
request: Request,
13+
responseStatusCode: number,
14+
responseHeaders: Headers,
15+
remixContext: EntryContext,
16+
) {
17+
let markup = renderToString(<RemixServer context={remixContext} url={request.url} />);
18+
19+
responseHeaders.set('Content-Type', 'text/html');
20+
21+
return new Response('<!DOCTYPE html>' + markup, {
22+
status: responseStatusCode,
23+
headers: responseHeaders,
24+
});
25+
}

‎packages/remix/test/integration/app/root.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import type { MetaFunction } from '@remix-run/node';
2+
import { Links, LiveReload, Meta, Outlet, Scripts, ScrollRestoration } from '@remix-run/react';
3+
import { withSentry } from '@sentry/remix';
4+
5+
export const meta: MetaFunction = () => ({
6+
charset: 'utf-8',
7+
title: 'New Remix App',
8+
viewport: 'width=device-width,initial-scale=1',
9+
});
10+
11+
function App() {
12+
return (
13+
<html lang="en">
14+
<head>
15+
<Meta />
16+
<Links />
17+
</head>
18+
<body>
19+
<Outlet />
20+
<ScrollRestoration />
21+
<Scripts />
22+
<LiveReload />
23+
</body>
24+
</html>
25+
);
26+
}
27+
28+
export default withSentry(App);

‎packages/remix/test/integration/app/routes/index.tsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function Index() {
2+
return (
3+
<div>
4+
<h1>Remix Integration Tests Home</h1>
5+
</div>
6+
);
7+
}

‎packages/remix/test/integration/app/routes/loader-json-response/$id.tsx

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { json, LoaderFunction } from '@remix-run/node';
2+
import { useLoaderData } from '@remix-run/react';
3+
4+
type LoaderData = { id: string };
5+
6+
export const loader: LoaderFunction = async ({ params: { id } }) => {
7+
return json({
8+
id,
9+
});
10+
};
11+
12+
export default function LoaderJSONResponse() {
13+
const data = useLoaderData<LoaderData>();
14+
15+
return (
16+
<div>
17+
<h1>{data.id}</h1>
18+
</div>
19+
);
20+
}

‎packages/remix/test/integration/jest.config.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
const baseConfig = require('../../jest.config.js');
2+
3+
module.exports = {
4+
globalSetup: '<rootDir>/test/server/utils/run-server.ts',
5+
...baseConfig,
6+
testMatch: ['**/*.test.ts'],
7+
};

‎packages/remix/test/integration/package.json

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
{
2+
"private": true,
3+
"sideEffects": false,
4+
"scripts": {
5+
"build": "remix build",
6+
"dev": "remix dev",
7+
"start": "remix-serve build",
8+
"test": "yarn build && yarn test:client && yarn test:server",
9+
"test:client": "echo \"TODO\"",
10+
"test:server": "jest"
11+
},
12+
"dependencies": {
13+
"@remix-run/express": "^1.6.5",
14+
"@remix-run/node": "^1.6.5",
15+
"@remix-run/react": "^1.6.5",
16+
"@remix-run/serve": "^1.6.5",
17+
"@sentry/remix": "file:../..",
18+
"react": "^17.0.2",
19+
"react-dom": "^17.0.2"
20+
},
21+
"devDependencies": {
22+
"@remix-run/dev": "^1.6.5",
23+
"@remix-run/eslint-config": "^1.6.5",
24+
"@types/react": "^17.0.47",
25+
"@types/react-dom": "^17.0.17",
26+
"eslint": "^8.20.0",
27+
"typescript": "^4.7.4"
28+
},
29+
"resolutions": {
30+
"@sentry/browser": "file:../../../browser",
31+
"@sentry/core": "file:../../../core",
32+
"@sentry/hub": "file:../../../hub",
33+
"@sentry/integrations": "file:../../../integrations",
34+
"@sentry/node": "file:../../../node",
35+
"@sentry/react": "file:../../../react",
36+
"@sentry/tracing": "file:../../../tracing",
37+
"@sentry/types": "file:../../../types",
38+
"@sentry/utils": "file:../../../utils"
39+
},
40+
"engines": {
41+
"node": ">=14"
42+
}
43+
}

‎packages/remix/test/integration/remix.config.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/** @type {import('@remix-run/dev').AppConfig} */
2+
module.exports = {
3+
appDirectory: 'app',
4+
assetsBuildDirectory: 'public/build',
5+
serverBuildPath: 'build/index.js',
6+
publicPath: '/build/',
7+
};

‎packages/remix/test/integration/test/server/loader.test.ts

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { assertSentryTransaction, getEnvelopeRequest } from '../../../../../node-integration-tests/utils';
2+
3+
describe('Remix API Loaders', () => {
4+
it('correctly instruments a Remix API loader', async () => {
5+
const url = 'http://localhost:3000/loader-json-response/123123';
6+
const envelope = await getEnvelopeRequest(url);
7+
const transaction = envelope[2];
8+
9+
assertSentryTransaction(transaction, {
10+
spans: [
11+
{
12+
description: url,
13+
op: 'remix.server.loader',
14+
},
15+
{
16+
description: url,
17+
op: 'remix.server.documentRequest',
18+
},
19+
],
20+
});
21+
});
22+
});

‎packages/remix/test/integration/test/server/utils/run-server.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import express, { Express } from 'express';
2+
import { createRequestHandler } from '@remix-run/express';
3+
4+
/**
5+
* Runs a test server
6+
*/
7+
function runServer(testDir: string): void {
8+
const app = express();
9+
10+
app.all('*', createRequestHandler({ build: require('../../../build') }));
11+
12+
app.listen(3000);
13+
14+
// TODO: Finish app after tests
15+
}
16+
17+
export default runServer;

‎packages/remix/test/integration/tsconfig.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
3+
"compilerOptions": {
4+
"lib": ["DOM", "DOM.Iterable", "ES2019"],
5+
"isolatedModules": true,
6+
"esModuleInterop": true,
7+
"jsx": "react-jsx",
8+
"moduleResolution": "node",
9+
"resolveJsonModule": true,
10+
"target": "ES2019",
11+
"strict": true,
12+
"allowJs": true,
13+
"forceConsistentCasingInFileNames": true,
14+
"baseUrl": ".",
15+
"paths": {
16+
"~/*": ["./app/*"]
17+
},
18+
"noEmit": true
19+
}
20+
}

‎packages/remix/test/integration/tsconfig.test.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
4+
"include": ["suites/**/*.ts"],
5+
6+
"compilerOptions": {
7+
// should include all types from `./tsconfig.json` plus types for all test frameworks used
8+
"types": ["node", "jest"]
9+
10+
// other package-specific, test-specific options
11+
}
12+
}

0 commit comments

Comments
 (0)