Skip to content

Commit

Permalink
Fixes for typos and punctuation
Browse files Browse the repository at this point in the history
  • Loading branch information
alansemenov committed Apr 23, 2024
1 parent f0c6c9f commit 4a36dcf
Show file tree
Hide file tree
Showing 8 changed files with 43 additions and 43 deletions.
8 changes: 4 additions & 4 deletions docs/client-side.adoc
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
= Client side
:sourcedir: ../

This chapter covers setting up and running client-side tests
This chapter covers setting up and running client-side tests.

== Node modules

Expand All @@ -14,7 +14,7 @@ npm install --save-dev react react-dom react-test-renderer @types/react

== Configuration

Since we are going to write a `tsx` file, we need to make sure the tsconfig.json file includes the jsx option.
Since we are going to write a `tsx` file, we need to make sure the `tsconfig.json` file includes the `jsx` option.

.src/main/resources/assets/tsconfig.json
[source, json]
Expand All @@ -30,7 +30,7 @@ Since we are going to write a `tsx` file, we need to make sure the tsconfig.json

== Source code

Here is the react component we will be testing:
Here is the React component we will be testing:

.src/main/resources/assets/js/HelloWorld.tsx
[source, typescript]
Expand Down Expand Up @@ -82,7 +82,7 @@ Ran all test suites matching /src\/jest\/client\/HelloWorld.test.tsx/i.

== Summary

You have now seen how to write a test for a React component using Jest and React Test Renderer.
You have now learned how to write a test for a React component using Jest and React Test Renderer.

Now that we have some tests, it may be useful to store coverage reports in a tool that can show progress over time.
One such tool is Codecov.
Expand Down
4 changes: 2 additions & 2 deletions docs/codecov.adoc
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
= Codecov
:toc: right

Discover how to see test progress over time usig Codecov
Discover how to see test progress over time using Codecov.

== Intro

Expand Down Expand Up @@ -76,4 +76,4 @@ jobs:

With the above setup, you will get a nice test coverage report every time you run `npm test` and also every time you push to GitHub. The report will be sent to Codecov where you can visualize it and track your progress over time.

The final chapter will demonstrate how to <<colocate#,colocate>> tests with the source code.
The final chapter will demonstrate how to <<colocation#,colocate>> tests with the source code.
18 changes: 9 additions & 9 deletions docs/colocation.adoc
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
= Colocation

Optionally place tests next to your source code file
Optionally place tests next to your source code file.

== Intro

Expand All @@ -10,7 +10,7 @@ We will cover it all in this chapter.

== Jest configuration

In order for jest to find and run the colocated tests, the test files must be included in the `testMatch` configuration. This can be done by adding the colocated test files as include patterns in the jest configuration files:
In order for Jest to find and run the colocated tests, the test files must be included in the `testMatch` configuration. This can be done by adding the colocated test files as include patterns in the Jest configuration files:

.jest.config.ts
[source, Typescript]
Expand Down Expand Up @@ -48,7 +48,7 @@ const serverSideConfig: Config.InitialProjectOptions = {

So far, we have been using Tsup to build the sources. If the tests are placed in the same directories as the source code, the build system will process the tests as source code. This is not what we want. We want the build system to ignore the tests.

This can be done by adding the test files as ignore patterns in the tsup configuration files.
This can be done by adding the test files as ignore patterns in the Tsup configuration files.

.tsup/constants.ts
[source, Typescript]
Expand Down Expand Up @@ -105,11 +105,11 @@ When running type checks these tsconfig.json files are used:
* src/jest/client/tsconfig.json
* src/jest/server/tsconfig.json

Each of them bringing their own include and exclude patters.
, each of them bringing their own include and exclude patters.

In the current configuration include patterns with `\*.ts` and `*.tsx` are used.

Obviously those patterns also matches test files ending with `\*.test.ts` or `*.test.tsx`.
Obviously those patterns also match test files ending with `\*.test.ts` or `*.test.tsx`.

Here is how to make sure test files a type checked as `test files`, not as `source files`:

Expand Down Expand Up @@ -199,19 +199,19 @@ Here is how to make sure test files a type checked as `test files`, not as `sour

== IDE

Typically IDE's use the closest tsconfig.json to resolve import paths and global types.
Typically, IDEs use the closest `tsconfig.json` to resolve import paths and global types.

Which means that a test file colocated with source code is treated as source code by the IDE.

I can think of a couple solutions to this:
There may be a couple solutions to this:

=== Adding support for test syntax to all source files.

This is a bad option, because it may cause runtime problems if a developer adds test syntax in a source file, and get no warnings while coding, type checking or building.

=== In test files: Use relative imports and avoid globals.

This can be achived by importing jest globals directly from `@jest/globals`.
This can be achieved by importing jest globals directly from `@jest/globals`.

./src/main/resources/**/any.test.ts
[source, Typescript]
Expand All @@ -231,4 +231,4 @@ import {

== Summary

That wraps up this tutorial, we hope you enjoyed it - Visit https://developer.enonic.com/docs/tutorials[the turoials section^] on the developer portal for more.
This wraps up the tutorial, we hope you enjoyed it. Visit https://developer.enonic.com/docs/tutorials[the tutorials section^] on our Developer Portal for more.
10 changes: 5 additions & 5 deletions docs/globals.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ This chapter introduces the concept of mocking.

== Introduction

Mocking the act of creating fake objects that stand in for real objects within the system. This way, you may test or simulate bigger parts of a system - even without running that system.
Mocking is the concept of creating fake objects that stand in for real objects in the system. This way, you may test or simulate bigger parts of a system - even without that system being actually available.

== Globals

Expand Down Expand Up @@ -82,7 +82,7 @@ globals: {
----

A more flexible solution, that also let you mock functions, like `log.info` is to use a setup file.
It will run before the execution of each test file:
It will run before the execution of each test file.

Create a setup file:

Expand All @@ -105,7 +105,7 @@ This will mock default values for the global `app` and `log` objects, and the va

== Types

To avoid type errors when accessing those objects, you can add a type declaration file referencing `@enonic-types/global`
To avoid type errors when accessing those objects, you can add a type declaration file referencing `@enonic-types/global`.

.src/jest/server/global.d.ts
[source, typescript]
Expand All @@ -123,6 +123,6 @@ include::{sourcedir}src/jest/server/getAppConfig.test.ts[]

== Summary

In this tutorial, you learned how to mock global objects in the Enonic XP Framework when writing tests with Jest.
In this chapter you learned how to mock global objects in the Enonic XP Framework when writing tests with Jest.

Let's move on to the next tutorial to learn how to <<mock#,mock functions>> and write our first "real" test for Enonic server-side code.
Let's move on to the next chapter and learn how to <<mock#,mock functions>> and write our first "real" test for Enonic server-side code.
20 changes: 10 additions & 10 deletions docs/mock-xp.adoc
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
= Mock XP
:sourcedir: ../

In this chapter we introduce Mock XP
In this chapter we introduce https://www.npmjs.com/package/@enonic/mock-xp[Mock XP^] - an NPM library to mock Enonic XP APIs and state.

== Introduction

Expand All @@ -27,7 +27,7 @@ include::{sourcedir}src/main/resources/controllers/preview.ts[]
----

== Tests

In this test `mock-xp` is used to set up a project repo, a person folder, a couple of images, and a couple content items (of type `person`) which reference the images.

In addition, mock-xp's `Log` is used to get nice colorful logging. In order for `libPortal.getContent()` to work, `request` property is set on the `libPortal` object.
Expand All @@ -50,7 +50,7 @@ include::{sourcedir}src/jest/server/preview.test.ts[]

Running the test produces the glorious result:

npm test src/jest/server/preview.test.ts
npm test src/jest/server/preview.test.ts

[source, Terminal]
----
Expand All @@ -63,13 +63,13 @@ Running the test produces the glorious result:
✓ is able to render a page for Jeffrey Wright
----------------------------|---------|----------|---------|---------|-------------------
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s
----------------------------|---------|----------|---------|---------|-------------------
All files | 100 | 54.54 | 100 | 100 |
jest/server | 100 | 100 | 100 | 100 |
mockXP.ts | 100 | 100 | 100 | 100 |
main/resources/controllers | 100 | 16.66 | 100 | 100 |
preview.ts | 100 | 16.66 | 100 | 100 | 16-34
All files | 100 | 54.54 | 100 | 100 |
jest/server | 100 | 100 | 100 | 100 |
mockXP.ts | 100 | 100 | 100 | 100 |
main/resources/controllers | 100 | 16.66 | 100 | 100 |
preview.ts | 100 | 16.66 | 100 | 100 | 16-34
----------------------------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests: 2 passed, 2 total
Expand All @@ -85,4 +85,4 @@ This chapter demonstrated how to write tests using Jest in combination with Mock

Mock XP was used to mock the Enonic https://developer.enonic.com/docs/xp/stable/api/lib-content[content^] and https://developer.enonic.com/docs/xp/stable/api/lib-portal[portal^] APIs.

Coming up, we demonstrate how to write a <<client-side#,client-side>> test.
Next we demonstrate how to write a <<client-side#,client-side>> test.
6 changes: 3 additions & 3 deletions docs/mock.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ include::{sourcedir}src/main/resources/lib/tutorial-jest/sanitize.ts[]

== Test without mock

Trying to run this simple test ...
Try to run this simple test:

[source, TypeScript]
----
Expand All @@ -35,7 +35,7 @@ describe('sanitize', () => {
});
----

... will fail with the following error message:
It should fail with the following error message:

[source, Terminal]
----
Expand All @@ -62,6 +62,6 @@ Obviously this mock doesn't cover ascii-folding for the whole unicode range, but

== Summary

This guide showed how to mock an Enonic library invoked by a Typescript. This is neccessary when you want to test your code in a controlled environment, without having to rely on the actual library being present.
This chapter showed how to mock an Enonic library invoked by a Typescript. This is necessary when you want to test your code in a controlled environment, without having to rely on the actual library being present.

Writing mocks for entire libraries can be a bit tedious, so in the next chapter we will rather use the <<mock-xp#,Mock XP>> library.
16 changes: 8 additions & 8 deletions docs/setup.adoc
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
= Setup
:sourcedir: ../

This chapter covers setting up Jest for your Enonic app
This chapter covers setting up Jest for your Enonic app.

== Sample project

Expand All @@ -16,9 +16,9 @@ This will create an app and place it in a folder called `jest-tutorial`.

== Node modules

In order to write tests in TypeScript and run them using Jest, a few Node modules needs to be installed.
In order to write tests in TypeScript and run them using Jest, a few Node modules need to be installed.

Run the following command at the root of the Enonic project:
Run the following command at the root of the Enonic project you created in the previous step:

[source, Terminal]
----
Expand All @@ -39,7 +39,7 @@ Jest needs to be configured to run Typescript tests. This is done by creating a
include::{sourcedir}jest.config.ts[]
----

Read more about configuring Jest here: https://jestjs.io/docs/configuration
Read more about configuring Jest https://jestjs.io/docs/configuration[here^].

=== tsconfig.json

Expand All @@ -61,7 +61,7 @@ include::{sourcedir}src/jest/server/tsconfig.json[]

== Execution

Finally, we wire the test command to execute Jest
Finally, we wire the test command to execute Jest tests.

=== Using NPM

Expand Down Expand Up @@ -89,7 +89,7 @@ NOTE: You may also run a specific test like this: `npm test src/jest/server/fibo

=== Using Enonic CLI

You may also run the tests using Enonic CLI. CLI uses the default build system (Gradle), you must update the `build.gradle` file with the following lines:
You may also run the tests using Enonic CLI. CLI uses the default build system (Gradle), so you must update the `build.gradle` file with the following lines:

.build.gradle
[source, gradle]
Expand All @@ -110,8 +110,8 @@ tasks.register('npmTest', NpmTask) {
test.dependsOn npmTest
----

As you can see, this simply tells Gradle to invoke the NPM test.
You may now tests with the following command as well:
As you can see, this simply tells Gradle to invoke the NPM's test script.
You may now test with the following command as well:

[source, shell]
----
Expand Down
4 changes: 2 additions & 2 deletions docs/test.adoc
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
= Simple test
:sourcedir: ../

In this chapter, you'll add code, and test it with Jest
In this chapter, you'll add code, and test it with Jest.

== How it works

Expand Down Expand Up @@ -72,6 +72,6 @@ Ran all test suites matching /src\/jest\/server\/fibonacci.test.ts/i.

== Summary

This tutorial showed how to write and run a simple Jest test for Enonic XP projects.
This chapter explained how to write and run a simple Jest test for an Enonic XP project.

In order to write more advanced tests, we must introduce a new concept. Let's have a look at <<globals#,mocking>>.

0 comments on commit 4a36dcf

Please sign in to comment.