I'm trying to understand how SonarQube is handling Code Coverage for ReactJS.
I have created basic Jest test which is executed by a script set in my package.json:
"test": "react-scripts test --env=jsdom --coverage --testResultsProcessor jest-sonar-reporter",
and has set coverage and reporting as
"jestSonar": {
"reportPath": "reports",
"reportFile": "test-report.xml",
"indent": 4
}
Test will pass, coverage folder and report is created as expected. Then I try to run sonar-scanner which has a config as follow:
const sonarqubeScanner = require('sonarqube-scanner');
sonarqubeScanner({
serverUrl: 'https://sonarqube.myhost.com/',
options : {
'sonar.sources': '.',
'sonar.exclusions' : 'src/**/*.bak.*, src/**/*.bak, src/**/*.orig, **/*.test.*',
'sonar.inclusions' : 'src/**',
'sonar.tests': "./src/__tests__",
"sonar.test.inclusions": "./src/__tests__/**/*.test.js, ./src/__tests__/*.test.js",
'sonar.javascript.lcov.reportPaths' : 'coverage/lcov.info',
"sonar.testExecutionReportPaths": "reports/test-report.xml",
"sonar.coverage.jacoco.xmlReportPaths" : "reports/test-report.xml"
}
}, () => {});
SonarQube scan will return SUCCESS but when I will go to the SonarQube dashboard for my project I do not see any updates for the Code Coverage neither Unit Test reported.
Any clue what is going on with it?
Related
Given the following directory structure...
- /src/__mocks__
- X.spec.tsx <-- mock test
- Y.spec.tsx <-- mock test
- Z.spec.tsx <-- mock test
- /src/e2e_tests <-------------- only run the tests inside this directory
- X.spec.tsx <-- end-to-end test
- Y.spec.tsx <-- end-to-end test
- Z.spec.tsx <-- end-to-end test
- /src/components
- A.tsx
- A.spec.tsx <-- unit test
- B.tsx
- B.spec.tsx <-- unit test
- C.tsx
- C.spec.tsx <-- unit test
- /src/views
- X.tsx
- X.spec.tsx <-- unit test
- Y.tsx
- Y.spec.tsx <-- unit test
- Z.tsx
- Z.spec.tsx <-- unit test
- /src
- App.tsx
- index.tsx
- jest.config.ts
- playwright.config.ts
- package.json
- tsconfig.json
- tsconfig.spec.json
- ect...
I've tried the following: How do you specify a test folder/path with Playwright?, however, this will also attempt to run all the tests outside the folder.
I've tried reading through the docs here: https://playwright.dev/docs/test-configuration and have tried the following combination:
testDir
testIgnore
testMatch
but can't get only e2e_tests directory tests to run while ignoring all other tests.
One way to do this is to create a project in your existing playwright config file and just add the testDir there, something like:
projects: [
{
name: 'chromium',
use: {...devices['Desktop Chrome']},
},
{
name: 'firefox',
use: {...devices['Desktop Firefox']},
},
{
name: 'webkit',
use: {...devices['Desktop Safari']},
},
{
name: 'e2e_tests',
testDir: './src/e2e_tests',
testMatch: /.*.spec.tsx/,
},
]
And then run your tests like:
npx playwright test --project=e2e_tests
Just using the playwright command line should do the job
Setup your configuration to look for all *.spec.tsx files for test and run
npx playwright src/e2e_tests
Documentation ref: https://playwright.dev/docs/test-cli
I am trying to do unit testing of my React app using Enzyme with Jest but getting this error
` FAIL src/components/XYZ/tests/ABC.test.js
● Test suite failed to run
SyntaxError: Name argument is not a valid custom element name.
Test Suites: 2 failed, 2 total
Tests: 0 total
Snapshots: 0 total
Time: 3.224 s
Ran all test suites.`
My Jest Config file is as following
"jest": {
"moduleNameMapper": {
"d3": "<rootDir>/node_modules/d3/dist/d3.min.js",
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
"^.+\\.(css|less|scss)$": "identity-obj-proxy"
},
"setupFiles": [
"./src/"
],
"setupFilesAfterEnv": [
"./src/setUpTests.js"
],
"testPathIgnorePatterns": [
"./node_modules/"
]
},
Please let me know what I am doing wrong here ? TIA
I think the configuration used for setupFiles is wrong here. As per jest documentation
https://jestjs.io/docs/configuration#setupfiles-array
setUpFiles is used for "A list of paths to modules that run some code to configure or set up the testing environment. Each setupFile will be run once per test file. Since every test runs in its own environment, these scripts will be executed in the testing environment before executing setupFilesAfterEnv and before the test code itself. "
Please either remove setUpFiles or use proper file path here .
I try to test ag-grid component using Jest:
describe('DataGridInternal Component Tests', () => {
it('includes class names on DataGrid', () => {
const component = mount(<DataGridInternal {...SAMPLE_PROPS} />);
expect(component.find('[data-test="ccfk-datagrid"]')).toHaveClassName('csf-material-grid');
});
});
I get the exception :
TypeError: this.btFirst.insertAdjacentElement is not a function
coming from
node_modules/ag-grid-community/dist/lib/rowModels/pagination/paginationComp.js:49
Once I remark this line the test is passing OK
any idea what is not correct?
I`m using :
"ag-grid-community": "21.2.2",
"ag-grid-react": "21.2.2",
"enzyme": "3.10.0",
"enzyme-adapter-react-16": "1.14.0",
"enzyme-to-json": "3.3.5"
Solution:
If you're using jest for your test runner, you'll need to upgrade by installing jest-environment-jsdom-fourteen, and adding the following to your jest.config
testEnvironment: 'jest-environment-jsdom-fourteen'
and
If you're using create-react-app,
npm i -D jest-environment-jsdom-fourteen
then in your scripts:
"test": "react-scripts test --env=jsdom-fourteen",
Sources: 1 2
I am facing the same issue as well.
I believe the issue lies in the version of the jsdom package that is being used with Jest testing runner.
insertAdjacentElement was implemented in version 13.1.0 of jsdom as stated in the changelog.
I am running a create-react-app v2, which currently does not use this version of jsdom.
Can you show how you're exactly requiring/importing ag-grid and defining your gridOptions structure?
I assume you're testing an existing table or a table you defined yourself in HTML?
I am using JEST to unit test my app. The test execution is running fine. However I am not able to collect code coverage correctly. The coverage is only logged for folder where I have the jest config file. Snapshot of folder structure:
In the console the coverage is only generated for enzyme-config.js. I tried using "collectCoverageFrom" : ["**/src/**/*.js"] but it throws me Unknown for all params. Am I missing something here?
jest-setup.json:
{
"testEnvironment": "jsdom",
"setupTestFrameworkScriptFile": "./enzyme.setup.js",
"testResultsProcessor": "jest-teamcity-reporter",
"coverageReporters": [
"teamcity", "lcov", "text"
],
"collectCoverageFrom" : ["**/src/**/*.js"],
"roots": [
"../../../__tests__/unit"
]
}
Coverage log:
A double star notation (**) like you are using in your collectCoverageFrom array, will only match file and folders which are in or in subfolders of the current folder. Assuming jest will match these files based on the folder in which the setup is defined, it will not find any files outside of the subtree which it is in. You might want to try ../src/**/*.js.
I have multiple suites in protractor which i want to test and run.It runs fine on Mozilla Firefox but only the first suite runs while using Google chrome(Version 51.0.2704.84 (64-bit)
suites: {
lawfirm: [
'../Test_Suites/Lawfirm/signUp_spec.js',
'../Test_Suites/Lawfirm/login_spec.js',
],
beneficiary : [
'../Test_Suites/Beneficiary/loginBeneficiary_spec.js',
]
},
Protractor Version : 3.3.0
You don't need to make suites an array, just use * to denote all files under a certain directory.
suites: {
lawfirm: '../Test_Suites/Lawfirm/*.spec.js'
}
Then run as you would normally:
protractor conf.js --suite lawfirm
You don't need to put an array. Just a comma separated list (no spaces after the comma either)
suites:{
suite1:'....','....',
suite2:'...','....'
}
Here is where you can find more information on the protractor config setup:
https://github.com/angular/protractor/blob/master/docs/referenceConf.js