forked from lab-cosmo/chemiscope
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
author Jakub Lála <68380659+jakublala@users.noreply.github.com> 1626864006 +0200 committer Jakub Lála <jakublala@gmail.com> 1626892362 +0200 parent 9eacadc author Jakub Lála <68380659+jakublala@users.noreply.github.com> 1626864006 +0200 committer Jakub Lála <jakublala@gmail.com> 1626892347 +0200 parent 9eacadc author Jakub Lála <68380659+jakublala@users.noreply.github.com> 1626864006 +0200 committer Jakub Lála <jakublala@gmail.com> 1626892324 +0200 Use Karma to run unit tests (lab-cosmo#173) Previously tests would run on node, and we would mimic a browser environment with JSDom, but the limitations of this approach were too big. Karma allows to run the tests in real browsers, which is where chemiscope runs in practice Temp Commit Changed .gitIgnore temp commit temp commit Added Karma Viewer test added Remove coverage files Moved files / Changed chrome launcher setup-chrome driver attempt Revert previosu commit Update .github/workflows/tests.yml Co-authored-by: Guillaume Fraux <luthaf@luthaf.fr> Enacted on suggestions Day 1 commit temp commit Added a few unit tests for Map Options One more
- Loading branch information
Showing
10 changed files
with
2,489 additions
and
3,810 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,93 @@ | ||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */ | ||
import { Config, ConfigOptions } from 'karma'; | ||
import webpack from 'webpack'; | ||
|
||
import { WEBPACK_CONFIG } from './webpack.config'; | ||
|
||
/** | ||
* Small webpack plugin to remove typescript declaration files (.d.ts) from the | ||
* list of assets. | ||
* | ||
* karma-webpack is using this list to know which file to load for tests, which | ||
* contains both the path to test files compiled to javascript, and the path to | ||
* typescript declaration files. Webpack output path is set to a temporary | ||
* directory, and the javascript files are inside this directory. The typescript | ||
* declaration files are not in this temporary directory (they are emitted in | ||
* `chemiscope/dist/` by tsc), and for a still unknown reason that can cause | ||
* karma not to found these file in some very specific cases (macOS and/or ZSH | ||
* seems to be required to hit this issue). | ||
* | ||
* Since we do not care about the `.d.ts` files in karma, this plugin works | ||
* around the issue by removing said files from the assets list. This can break | ||
* if webpack plugin API changes, or if karma-webpack stops using the assets. | ||
*/ | ||
class RemoveDeclarationsFromAssets implements webpack.WebpackPluginInstance { | ||
apply(compiler: webpack.Compiler) { | ||
compiler.hooks.done.tap('RemoveDeclarationsFromAssets', (stats) => { | ||
const toRemove = []; | ||
for (const path in stats.compilation.assets) { | ||
if (path.endsWith('.d.ts')) { | ||
toRemove.push(path); | ||
} | ||
} | ||
|
||
for (const key of toRemove) { | ||
delete stats.compilation.assets[key]; | ||
} | ||
}); | ||
} | ||
} | ||
|
||
WEBPACK_CONFIG.plugins?.push(new RemoveDeclarationsFromAssets()); | ||
|
||
module.exports = (config: Config) => { | ||
config.set({ | ||
browserNoActivityTimeout: 8000, | ||
client: { | ||
mocha: { | ||
timeout: 8000, | ||
}, | ||
}, | ||
|
||
files: [ | ||
// FIXME: we should not have to manually load jquery, but we | ||
// currently don't include it in the main bundle | ||
'node_modules/jquery/dist/jquery.min.js', | ||
'tests/**/*.test.ts', | ||
], | ||
frameworks: ['webpack', 'mocha', 'detectBrowsers'], | ||
|
||
preprocessors: { | ||
'tests/**/*.test.ts': 'webpack', | ||
}, | ||
reporters: ['progress'], | ||
singleRun: true, | ||
|
||
webpack: WEBPACK_CONFIG, | ||
webpackMiddleware: { | ||
stats: 'errors-only', | ||
}, | ||
|
||
detectBrowsers: { | ||
postDetection: function (availableBrowsers: string[]) { | ||
// Remove IE | ||
const IEindex = availableBrowsers.indexOf('IE'); | ||
if (IEindex !== -1) { | ||
availableBrowsers.splice(IEindex); | ||
} | ||
|
||
// Rename Safari to use SafariNative karma launcher | ||
const SafariIndex = availableBrowsers.indexOf('Safari'); | ||
if (SafariIndex !== -1) { | ||
availableBrowsers[SafariIndex] = 'SafariNative'; | ||
} | ||
|
||
return availableBrowsers; | ||
}, | ||
// we can not enable headless mode since firefox does not support | ||
// WebGL in this case (https://bugzilla.mozilla.org/show_bug.cgi?id=1375585) | ||
preferHeadless: false, | ||
usePhantomJS: false, | ||
}, | ||
} as ConfigOptions); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,127 @@ | ||
import { PropertiesMap } from '../../src/map'; | ||
import { EnvironmentIndexer } from '../../src/indexer'; | ||
import { Target } from '../../src/dataset'; | ||
import { getByID } from '../../src/utils'; | ||
import { AxisOptions } from '../../src/map/options'; | ||
|
||
import { assert } from 'chai'; | ||
|
||
let KARMA_INSERTED_HTML: string; | ||
|
||
const DUMMY_PROPERTIES = { | ||
first: { | ||
target: 'structure' as Target, | ||
values: [1.1, 1.2], | ||
}, | ||
second: { | ||
target: 'structure' as Target, | ||
values: [2.1, 2.2], | ||
}, | ||
third: { | ||
target: 'structure' as Target, | ||
values: [3.1, 3.2], | ||
}, | ||
}; | ||
|
||
const DUMMY_MAP_SETTINGS = { | ||
x: { | ||
max: 0, | ||
min: 10, | ||
property: 'first', | ||
scale: 'linear', | ||
}, | ||
y: { | ||
max: 0, | ||
min: 10, | ||
property: 'first', | ||
scale: 'linear', | ||
}, | ||
z: { | ||
max: 0, | ||
min: 10, | ||
property: 'first', | ||
scale: 'linear', | ||
}, | ||
color: { | ||
max: 0, | ||
min: 10, | ||
property: 'second', | ||
scale: 'linear', | ||
}, | ||
symbol: '', | ||
palette: 'hsv (periodic)', | ||
size: { | ||
factor: 50, | ||
property: '', | ||
}, | ||
}; | ||
|
||
const DUMMY_STRUCTURES = [ | ||
{ | ||
size: 2, | ||
names: ['X', 'Y'], | ||
x: [0, 1], | ||
y: [0, 1], | ||
z: [0, 1], | ||
}, | ||
]; | ||
|
||
describe('Map', () => { | ||
before(() => { | ||
// store karma's default HTML | ||
KARMA_INSERTED_HTML = document.body.innerHTML; | ||
}); | ||
|
||
it('can remove itself from DOM', () => { | ||
const root = document.createElement('div'); | ||
const indexer = new EnvironmentIndexer('structure', DUMMY_STRUCTURES); | ||
const map = new PropertiesMap( | ||
{ element: root, settings: DUMMY_MAP_SETTINGS }, | ||
indexer, | ||
DUMMY_PROPERTIES | ||
); | ||
|
||
assert(root.innerHTML !== ''); | ||
assert(document.body.innerHTML !== ''); | ||
|
||
map.remove(); | ||
assert(root.innerHTML === ''); | ||
|
||
// remove SVG element created by Plotly | ||
document.getElementById('js-plotly-tester')?.remove(); | ||
assert(document.body.innerHTML === KARMA_INSERTED_HTML); | ||
}); | ||
|
||
// it('color range resets when clicked', () => { | ||
// const root = document.createElement('div'); | ||
// const indexer = new EnvironmentIndexer('structure', DUMMY_STRUCTURES); | ||
// const map = new PropertiesMap( | ||
// { element: root, settings: DUMMY_MAP_SETTINGS }, | ||
// indexer, | ||
// DUMMY_PROPERTIES | ||
// ); | ||
// const minSelectElement = getByID<HTMLSelectElement>(`chsp-color-min`); | ||
// const maxSelectElement = getByID<HTMLSelectElement>(`chsp-color-max`); | ||
// const originalMin = minSelectElement.value; | ||
// const originalMax = maxSelectElement.value; | ||
|
||
// const colorSelectElement = getByID<HTMLSelectElement>(`chsp-color`); | ||
// colorSelectElement.value = 'third'; | ||
// colorSelectElement.dispatchEvent(new window.Event('change')); | ||
|
||
// console.log(originalMin); | ||
|
||
// minSelectElement.value = '-0.01'; | ||
// maxSelectElement.value = '0.01'; | ||
|
||
// map['_colorReset'].onclick(); | ||
// assert(minSelectElement.value === originalMin); | ||
// assert(maxSelectElement.value === originalMax); | ||
// }); | ||
}); | ||
|
||
/** Removes the map and an additional HTML element creted by Plotly */ | ||
function removeMap(map: PropertiesMap): void { | ||
map.remove(); | ||
document.getElementById('js-plotly-tester')?.remove(); | ||
} |
Oops, something went wrong.