Skip to content
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.

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

feat(examples): adds example for running jest with typescript #2245

Merged
merged 10 commits into from
Nov 10, 2020
4 changes: 2 additions & 2 deletions .bazelrc
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ import %workspace%/common.bazelrc
# This lets us glob() up all the files inside the examples to make them inputs to tests
# To update these lines, just run `yarn bazel:update-deleted-packages`
# (Note, we cannot use common --deleted_packages because the bazel version command doesn't support it)
build --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/home,examples/angular/src/app/hello-world,examples/angular/src/app,examples/angular/src/app/todos,examples/angular/src/app/todos/reducers,examples/angular/src/shared/material,examples/angular/src/lib/shorten,examples/angular/src,examples/angular/src/assets,examples/angular/tools,examples/angular_bazel_architect,examples/angular_bazel_architect/projects/frontend-lib,examples/angular_view_engine,examples/angular_view_engine/e2e,examples/angular_view_engine/src/app/home,examples/angular_view_engine/src/app/hello-world,examples/angular_view_engine/src/app,examples/angular_view_engine/src/app/todos,examples/angular_view_engine/src/app/todos/reducers,examples/angular_view_engine/src/shared/material,examples/angular_view_engine/src/lib/typography,examples/angular_view_engine/src/lib/shorten,examples/angular_view_engine/src,examples/angular_view_engine/src/assets,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/create-react-app,examples/cypress,examples/from_source,examples/jest,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/react_webpack,examples/user_managed_deps,examples/vendored_node,examples/vendored_node_and_yarn,examples/vue,examples/vue/src,examples/web_testing,examples/webapp,examples/worker,e2e/bazel_managed_deps,e2e/coverage,e2e/coverage/node_modules/@bazel/typescript/internal/devserver,e2e/coverage/node_modules/@bazel/typescript/internal,e2e/coverage/node_modules/@bazel/typescript/devserver,e2e/coverage/node_modules/@bazel/typescript/third_party/github.com/bazelbuild/bazel/src/main/protobuf,e2e/coverage/node_modules/@bazel/typescript/third_party/npm/requirejs,e2e/fine_grained_symlinks,e2e/jasmine,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/nodejs_image,e2e/nodejs_image/foolib,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp
query --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/home,examples/angular/src/app/hello-world,examples/angular/src/app,examples/angular/src/app/todos,examples/angular/src/app/todos/reducers,examples/angular/src/shared/material,examples/angular/src/lib/shorten,examples/angular/src,examples/angular/src/assets,examples/angular/tools,examples/angular_bazel_architect,examples/angular_bazel_architect/projects/frontend-lib,examples/angular_view_engine,examples/angular_view_engine/e2e,examples/angular_view_engine/src/app/home,examples/angular_view_engine/src/app/hello-world,examples/angular_view_engine/src/app,examples/angular_view_engine/src/app/todos,examples/angular_view_engine/src/app/todos/reducers,examples/angular_view_engine/src/shared/material,examples/angular_view_engine/src/lib/typography,examples/angular_view_engine/src/lib/shorten,examples/angular_view_engine/src,examples/angular_view_engine/src/assets,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/create-react-app,examples/cypress,examples/from_source,examples/jest,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/react_webpack,examples/user_managed_deps,examples/vendored_node,examples/vendored_node_and_yarn,examples/vue,examples/vue/src,examples/web_testing,examples/webapp,examples/worker,e2e/bazel_managed_deps,e2e/coverage,e2e/coverage/node_modules/@bazel/typescript/internal/devserver,e2e/coverage/node_modules/@bazel/typescript/internal,e2e/coverage/node_modules/@bazel/typescript/devserver,e2e/coverage/node_modules/@bazel/typescript/third_party/github.com/bazelbuild/bazel/src/main/protobuf,e2e/coverage/node_modules/@bazel/typescript/third_party/npm/requirejs,e2e/fine_grained_symlinks,e2e/jasmine,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/nodejs_image,e2e/nodejs_image/foolib,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp
build --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/home,examples/angular/src/app/hello-world,examples/angular/src/app,examples/angular/src/app/todos,examples/angular/src/app/todos/reducers,examples/angular/src/shared/material,examples/angular/src/lib/shorten,examples/angular/src,examples/angular/src/assets,examples/angular/tools,examples/angular_bazel_architect,examples/angular_bazel_architect/projects/frontend-lib,examples/angular_view_engine,examples/angular_view_engine/e2e,examples/angular_view_engine/src/app/home,examples/angular_view_engine/src/app/hello-world,examples/angular_view_engine/src/app,examples/angular_view_engine/src/app/todos,examples/angular_view_engine/src/app/todos/reducers,examples/angular_view_engine/src/shared/material,examples/angular_view_engine/src/lib/typography,examples/angular_view_engine/src/lib/shorten,examples/angular_view_engine/src,examples/angular_view_engine/src/assets,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/create-react-app,examples/cypress,examples/from_source,examples/jest,examples/jest/ts,examples/jest/ts/src,examples/jest/ts/test,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/react_webpack,examples/user_managed_deps,examples/vendored_node,examples/vendored_node_and_yarn,examples/vue,examples/vue/src,examples/web_testing,examples/webapp,examples/worker,e2e/bazel_managed_deps,e2e/coverage,e2e/coverage/node_modules/@bazel/typescript/internal/devserver,e2e/coverage/node_modules/@bazel/typescript/internal,e2e/coverage/node_modules/@bazel/typescript/devserver,e2e/coverage/node_modules/@bazel/typescript/third_party/github.com/bazelbuild/bazel/src/main/protobuf,e2e/coverage/node_modules/@bazel/typescript/third_party/npm/requirejs,e2e/fine_grained_symlinks,e2e/jasmine,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/nodejs_image,e2e/nodejs_image/foolib,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp
query --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/home,examples/angular/src/app/hello-world,examples/angular/src/app,examples/angular/src/app/todos,examples/angular/src/app/todos/reducers,examples/angular/src/shared/material,examples/angular/src/lib/shorten,examples/angular/src,examples/angular/src/assets,examples/angular/tools,examples/angular_bazel_architect,examples/angular_bazel_architect/projects/frontend-lib,examples/angular_view_engine,examples/angular_view_engine/e2e,examples/angular_view_engine/src/app/home,examples/angular_view_engine/src/app/hello-world,examples/angular_view_engine/src/app,examples/angular_view_engine/src/app/todos,examples/angular_view_engine/src/app/todos/reducers,examples/angular_view_engine/src/shared/material,examples/angular_view_engine/src/lib/typography,examples/angular_view_engine/src/lib/shorten,examples/angular_view_engine/src,examples/angular_view_engine/src/assets,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/create-react-app,examples/cypress,examples/from_source,examples/jest,examples/jest/ts,examples/jest/ts/src,examples/jest/ts/test,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/react_webpack,examples/user_managed_deps,examples/vendored_node,examples/vendored_node_and_yarn,examples/vue,examples/vue/src,examples/web_testing,examples/webapp,examples/worker,e2e/bazel_managed_deps,e2e/coverage,e2e/coverage/node_modules/@bazel/typescript/internal/devserver,e2e/coverage/node_modules/@bazel/typescript/internal,e2e/coverage/node_modules/@bazel/typescript/devserver,e2e/coverage/node_modules/@bazel/typescript/third_party/github.com/bazelbuild/bazel/src/main/protobuf,e2e/coverage/node_modules/@bazel/typescript/third_party/npm/requirejs,e2e/fine_grained_symlinks,e2e/jasmine,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/nodejs_image,e2e/nodejs_image/foolib,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp

# Mock versioning command to test the --stamp behavior
build --workspace_status_command="echo BUILD_SCM_VERSION 1.2.3"
Expand Down
4 changes: 4 additions & 0 deletions examples/BUILD.bazel
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,10 @@ example_integration_test(

example_integration_test(
name = "examples_jest",
bazel_commands = ["build ..."],
Copy link
Collaborator

Choose a reason for hiding this comment

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

this looks wrong, we won't run bazel test on the example anymore, so how do we know if it works?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Oh, copy paste :)

Didn't really understand how the integration tests work

npm_packages = {
"//packages/typescript:npm_package": "@bazel/typescript",
},
owners = ["@mrmeku"],
)

Expand Down
11 changes: 11 additions & 0 deletions examples/jest/BUILD.bazel
Original file line number Diff line number Diff line change
@@ -1,5 +1,16 @@
load(":jest.bzl", "jest_test")

alias(
name = "tsconfig.json",
actual = "//ts:tsconfig.json",
visibility = ["//visibility:public"],
)

exports_files(
["jest.ts.config.js"],
visibility = ["//visibility:public"],
)

jest_test(
name = "test",
srcs = [
Expand Down
4 changes: 4 additions & 0 deletions examples/jest/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,7 @@
This example shows how you might use the Jest testing framework

It has a utility macro in `jest.bzl` which makes a more ergonomic API for calling the `jest_test` rule in `@npm//jest-cli:index.bzl`. We suggest copying that to your repo.

# Jest typescript example

Under `ts/` there's an example of using jest with typescript directly with generated rule from `@npm//jest-cli:index.bzl`
8 changes: 8 additions & 0 deletions examples/jest/jest.ts.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
module.exports = {
testEnvironment: 'node',
reporters: ['default'],
testMatch: ['**/*.test.js'],
moduleNameMapper: {
'examples_jest/(.*)': '<rootDir>/$1',
},
};
5 changes: 4 additions & 1 deletion examples/jest/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,15 @@
"@babel/cli": "^7.6.0",
"@babel/core": "^7.6.0",
"@babel/preset-env": "^7.6.0",
"@bazel/typescript": "^2.2.2",
"@jest/core": "24.7.1",
"@jest/transform": "24.7.1",
"@types/jest": "^26.0.15",
"babel-jest": "24.7.1",
"babel-plugin-istanbul": "5.1.2",
"jest-cli": "24.9.0",
"patch-package": "^6.2.0"
"patch-package": "^6.2.0",
"typescript": "^3.8.3"
},
"scripts": {
"postinstall": "patch-package",
Expand Down
4 changes: 4 additions & 0 deletions examples/jest/ts/BUILD.bazel
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
exports_files(
["tsconfig.json"],
visibility = ["//visibility:public"],
)
9 changes: 9 additions & 0 deletions examples/jest/ts/src/BUILD.bazel
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
load("@npm//@bazel/typescript:index.bzl", "ts_library")

package(default_visibility = ["//visibility:public"])

ts_library(
name = "src",
srcs = glob(["*.ts"]),
deps = [],
)
1 change: 1 addition & 0 deletions examples/jest/ts/src/extra.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export default 'test';
3 changes: 3 additions & 0 deletions examples/jest/ts/src/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import extra from './extra';

export default extra;
37 changes: 37 additions & 0 deletions examples/jest/ts/test/BUILD.bazel
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
load("@npm//@bazel/typescript:index.bzl", "ts_library")
load("@npm//jest-cli:index.bzl", "jest_test")

ts_library(
name = "test_lib",
srcs = glob([
"**/*.ts",
]),
deps = [
"//ts/src",
"@npm//@types",
],
)

jest_test(
name = "test",
args = [
"--no-cache",
"--no-watchman",
"--ci",
"--colors",
"--config",
"jest.ts.config.js",
],
data = [
":test_lib",
"//:jest.ts.config.js",
],
tags = [
# Need to set the pwd to avoid jest needing a runfiles helper
# Windows users with permissions can use --enable_runfiles
# to make this test work
"no-bazelci-windows",
# TODO: why does this fail almost all the time, but pass on local Mac?
"no-bazelci-mac",
],
)
5 changes: 5 additions & 0 deletions examples/jest/ts/test/index.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import indexfile from '../src/index';

test('it should work', () => {
expect(indexfile).toBe('test');
});
11 changes: 11 additions & 0 deletions examples/jest/ts/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{
Copy link
Collaborator

Choose a reason for hiding this comment

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

maybe this file should go one directory up? is that more typical of how it's used?
then you wouldn't need the alias rule in the /BUILD.bazel

Copy link
Contributor Author

Choose a reason for hiding this comment

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

fixing

"compilerOptions": {
"target": "es5",
"module": "commonjs",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true
}
}