diff --git a/.travis.yml b/.travis.yml index 9941c4ae..4b9963a5 100644 --- a/.travis.yml +++ b/.travis.yml @@ -23,6 +23,12 @@ install: - yarn script: + # lint first, no point running tests just to fail on lint + - yarn lint + + # test production build - yarn build + - yarn clean + + # dev build will run as part of `yarn test` - yarn test - - yarn lint \ No newline at end of file diff --git a/examples/index.html b/examples/index.html new file mode 100644 index 00000000..ed6f1719 --- /dev/null +++ b/examples/index.html @@ -0,0 +1,52 @@ + + + + + + + + + + + + + + + + + +
+ 2d_array.html + benchmark.html + canvas_data_model.html + file_browser.html + minesweeper.html + perspective_headers.html + perspective.html + react.html + spreadsheet.html + two_billion_rows.html + virtual_indices.html + web_worker.html +
+ + + + diff --git a/jest-puppeteer.config.js b/jest-puppeteer.config.js index 4f1408b0..c1f09e21 100644 --- a/jest-puppeteer.config.js +++ b/jest-puppeteer.config.js @@ -1,6 +1,13 @@ module.exports = { server: { - command: "yarn start -p 8081", + command: "yarn start --port 8081", + launchTimeout: 30000, port: 8081, + waitOnScheme: { + resources: [ + "dist/css/material.css", + "dist/umd/regular-table.js", + ], + }, }, }; diff --git a/package.json b/package.json index d4d3596f..07a136f6 100644 --- a/package.json +++ b/package.json @@ -16,22 +16,21 @@ "unpkg": "dist/umd/regular-table.js", "jsdelivr": "dist/umd/regular-table.js", "files": [ - "dist/**/*", - "less", + "dist/css/*.css", + "dist/umd/*", + "src/less/*.less", "babel.config.js" ], "scripts": { "build:rollup": "rollup -c rollup.config.js", - "build:less": "lessc src/less/material.less dist/css/material.css", "build": "npm-run-all -p build:*", "clean": "rimraf dist", "docs": "jsdoc2md src/js/index.js --separators --heading-depth 1 > api.md", - "lint": "eslint src examples/*.html", "fix": "yarn lint --fix", + "lint": "eslint src examples/*.html", + "start": "rollup -c rollup.dev.config.js", "test": "jest --noStackTrace", - "start": "http-server", - "watch:babel": "babel src/js --watch --out-dir dist/esm", - "watch:webpack": "rollup -c rollup.config.js --watch", + "watch:rollup": "rollup -c rollup.dev.config.js --watch", "watch": "npm-run-all -p watch:*" }, "publishConfig": { @@ -55,7 +54,6 @@ "eslint": "^7.1.0", "eslint-plugin-html": "^6.0.2", "eslint-plugin-prettier": "^3.1.3", - "http-server": "^0.12.3", "jest": "^26.0.1", "jest-puppeteer": "^4.4.0", "jsdoc-to-markdown": "^6.0.1", @@ -67,6 +65,9 @@ "react-dom": "15", "rollup": "^2.13.1", "rollup-plugin-filesize": "^9.0.0", + "rollup-plugin-livereload": "^1.3.0", + "rollup-plugin-postcss": "^3.1.2", + "rollup-plugin-serve": "^1.0.1", "rollup-plugin-sourcemaps": "^0.6.2", "rollup-plugin-terser": "^6.1.0", "source-map-explorer": "^2.4.2", diff --git a/rollup.config.js b/rollup.config.js index 78c3ad5e..1f48d4a1 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -1,24 +1,47 @@ -import {terser} from "rollup-plugin-terser"; +import babel from "@rollup/plugin-babel"; import filesize from "rollup-plugin-filesize"; +import postcss from "rollup-plugin-postcss" import sourcemaps from "rollup-plugin-sourcemaps"; -import babel from "@rollup/plugin-babel"; +import {terser} from "rollup-plugin-terser"; -export default { +export default [{ + input: "src/less/material.less", + output: { + dir: "dist/css", + }, + plugins: [ + postcss({ + inject: false, + extract: "material.css", + sourceMap: false, + minimize: true, + }), + ], + watch: { + clearScreen: false, + }, +}, +{ input: "src/js/index.js", + output: { + sourcemap: true, + file: "dist/umd/regular-table.js", + }, plugins: [ babel({ exclude: "node_modules/**", babelHelpers: "bundled", }), - sourcemaps(), filesize(), + postcss({ + inject: false, + sourceMap: false, + minimize: true, + }), + sourcemaps(), terser(), ], watch: { clearScreen: false, }, - output: { - sourcemap: true, - file: "dist/umd/regular-table.js", - }, -}; +}]; diff --git a/rollup.dev.config.js b/rollup.dev.config.js new file mode 100644 index 00000000..51d8daf1 --- /dev/null +++ b/rollup.dev.config.js @@ -0,0 +1,56 @@ +import babel from "@rollup/plugin-babel"; +import filesize from "rollup-plugin-filesize"; +import livereload from "rollup-plugin-livereload" +import postcss from "rollup-plugin-postcss" +import serve from "rollup-plugin-serve" +import sourcemaps from "rollup-plugin-sourcemaps"; + +export default commandLineArgs => { + const port = +commandLineArgs.port || 8080; + // ref: https://github.com/rollup/rollup/issues/2694#issuecomment-463915954 + delete commandLineArgs.port; + + return [{ + input: "src/less/material.less", + output: { + dir: "dist/css", + }, + plugins: [ + postcss({ + inject: false, + extract: "material.css", + sourceMap: true, + }) + ], + watch: { + clearScreen: false, + }, + }, + { + input: "src/js/index.js", + output: { + sourcemap: true, + file: "dist/umd/regular-table.js", + }, + plugins: [ + babel({ + exclude: "node_modules/**", + babelHelpers: "bundled", + }), + filesize(), + livereload("dist"), + postcss({ + inject: false, + sourceMap: true, + }), + serve({ + contentBase: [".", "examples"], + port + }), + sourcemaps(), + ], + watch: { + clearScreen: false, + }, + }]; +}; diff --git a/src/js/scroll_panel.js b/src/js/scroll_panel.js index 2de2d671..0b656f63 100644 --- a/src/js/scroll_panel.js +++ b/src/js/scroll_panel.js @@ -8,9 +8,11 @@ * */ -import {css, log_perf, html, throttlePromise} from "./utils"; +import {log_perf, html, throttlePromise} from "./utils"; import {DEBUG, BROWSER_MAX_HEIGHT, DOUBLE_BUFFER_RECREATE, DOUBLE_BUFFER_ROW, DOUBLE_BUFFER_COLUMN} from "./constants"; +import container_css from "../less/container.less"; + /** * Handles the virtual scroll pane, as well as the double buffering * of the underlying . This DOM structure looks a little like @@ -64,7 +66,6 @@ export class RegularVirtualTableViewModel extends HTMLElement { create_shadow_dom() { this.attachShadow({mode: "open"}); const slot = ``; - const container_css = css`src/less/container.less`; this.shadowRoot.innerHTML = html`