examenopdracht-jonasvandycke

Examen opdracht

Description

In this package there is a file Examen opdracht, in which you can enter a temperature and it's converted into 7-segment values. The maximum number of digits that can be displayed is 7 digits.

In deze package kun je de grote van de digits kiezen of om ook al dan niet een kader rond de digits te plaatsen.

Digits

The values that can be used are for numbers 0 too 9 and Symbols C , ° , . and spaces.

The entering of the values is done in main.ts

Digit Size

The sizes that can be used are for normal = 1 and for 2x biger = 2.

The entering of the Size is done in main.ts

Frame

To choose if Frame is used or not can be done by using Frame = 'on' or Frame = 'off'.

The entering of the Frame is done in main.ts

Installation

To be able to use this package we first need to do the following installations.

Stap1: Install TypeScript

First we need to install Typescript. For npm Users:

npm install typescript --save

het installeren van deze package:

npm install examenopdracht-jonasvandycke

Step2: ESlint

2.1) Installation and setup

Run the following commands to setup ESLint in your TypeScript project.

npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin

Create an .eslintrc file.

touch .eslintrc

In it, use the following starter config.

{
  "root": true,
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint"
  ],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/eslint-recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": {
    "no-console": 1
  }
}

2.2) Ignoring files we don't want to lint

Create an .eslintignore in order to prevent ESLint from linting stuff we don't want it to.

touch .eslintignore

Then add the things we want to ignore. In the following code sample, we're ignoring the dist/ folder that contains the compiled TypeScript code. If you're compiling your TypeScript code to a different folder, make sure to use that instead of dist. You should be able to find this in your .tsconfig.

node_modules
dist

2.3) Adding a lint script

In your project package.json, lets add a lint script in order to lint all TypeScript code.

{
  "scripts": {
    ...
    "lint": "eslint . --ext .ts",
  }
}

Ready to try it out? Let's run the following command.

npm run lint

For information about ESLint see LINK

Step3: Github Pages

Pull in this file to enable Jekyll.

git pull [e-mail]:vives-software-engineering-2020/examenopdracht-JonasVanDycke.git bugfix/docs-jekyll

3.1) Automating GitHub Pages fix

Follow the following steps for fixing the Automation of GitHub Pages.

Step 1) Add a new devdependency called touch in your package.json file using the following command:

npm install touch -D

This will install a package that enables us to use the touch command from within JavaScript (and not depend on the operating system).

Step 2) Update your npm run docs command in the package.json:

Add the following script:

"nojekyll": "nodetouch docs/.nojekyll",

Update the docs script to:

"docs": "typedoc && npm run nojekyll",

This will make sure the .nojekyll file is created after creating the docs.

Unit Tests

Install dependencies

npm install --save-dev @types/jest jest ts-jest

In your package.json add the following scripts to make it easy to use Jest:

  "scripts": {
    "test": "jest",
    "test:watch": "jest --coverage --watchAll",
    "coverage": "jest --coverage",
  },

This will add a script to run the tests, and a script to check the test coverage.

Create jest.config.js in the root of your project (where your package.json file lives)

  module.exports = {
  transform: {'^.+\\.ts?$': 'ts-jest'},
  testEnvironment: 'node',
  testRegex: '/tests/.*\\.(test|spec)?\\.(ts|tsx)$',
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node']
}

This configuration file will add support for TypeScript to Jest using ts-jest.

Next we need to ignore tests when building our project using the TypeScript Compiler.

You can do this in your .tsconfig.json file. Your configuration should look something like this:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "lib": ["es2015"],
    "strict": true,
    "declaration": true,
    "outDir": "dist",
    "sourceMap": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.test.ts"]
}

Note the exclude settings will ignore tests files in the compiled result.

For more information on creating and running Unit Testing, see Examples.

Usage instructions and examples

Instruction

Once the package is installed, you can then use ts-node .\main.ts to run/test the code. In the main you choose the Values, Size and Frame.

If no unit of measurement is given, it will default to celsius.

Examples

1) Size 1, Frame off

In the main you can put in :

• temp (-25.9°C)
• size (1)
• frame (off)

console.log(lcd.LCD_Display(temp, size, frame));

Output:

    _  _     _  _  _ 		
 _  _||_    |_||_||  		
   |_  _| /  _|   |_ 	

2) Size 1, Frame on

In the main you can put in :

• temp (-25.9°C)
• size (1)
• frame (on)

console.log(lcd.LCD_Display(temp, size, frame));

Output:

 ___________________________
|     _  _     _  _  _      |
|  _  _||_    |_||_||  	    |
|    |_  _| /  _|   |_ 	    |
|___________________________|

3) Size 2, Frame off

In the main you can put in :

• temp (-25.9°C)
• size (2)
• frame (off)

console.log(lcd.LCD_Display(temp, size, frame));

Output:

       ___   ___         ___   ___   ___  		
          | |           |   | |   | |     		
          | |           |   | |   | |     		
 ___   ___| |___        |___| |___| |     		
      |         |           |       |     		
      |         |    /      |       |     		
      |___   ___|   /    ___|       |___  		
	

4) Size 2, Frame on

In the main you can put in :

• temp (-25.9°C)
• size (2)
• frame (on)

console.log(lcd.LCD_Display(temp, size, frame));

Output:

 _______________________________________________
|       ___   ___         ___   ___   ___  	|
|          | |           |   | |   | |     	|
|          | |           |   | |   | |    	|
| ___   ___| |___        |___| |___| |     	|
|      |         |           |       |     	|
|      |         |    /      |       |     	|
|      |___   ___|   /    ___|       |___  	|
|_______________________________________________|

**! Importent !** Remember that only the first 7 digits wil return om the terminal.

Unit Testing

Creat a Test

Consider that we have a class defined in scr/sum.ts containing the code:

export default function sum(a: number, b: number): number {
  return a + b;
}

Then you can create a test that will verify the functionality in a file called tests/sum.test.ts:

import sum from '../src/sum'

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

The most important parts of this file are:

1. A test() method containing a description of the test and a function to execute the test.
2. An expect() method that will actually run the code to be tested
3. A toBe() method that will check if the result equals a specific value. If this is true, the test succeeds. If this is false, the test will fail.

Running the Tests

To runn the tests use:

npm run test

or you could use:

npm test

This will generate a report that will look like:

PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)

Running the Tests Automatically

Tests can be ran automatically, showing results directly after you save your changes. This results in a very fast feedback loop. Just use the following command:

npm run test:watch

This will run the tests and will keep watching your files for any changes. When a file changes, the test will run again automatically.

For information about the Unit Testing see:

• Test Driven Development with Jest
• javascript testing introduction

For information about the Unit Testing and Jest see:

• Using Matchers
• Expect
• Testing Asynchronous Code
• Setup and Teardown

License

For information about the License see LICENSE

Author

Jonas VD - student at University College Vives, Belgium