From db2aecce244738f6690cc7f63602a47960ee1782 Mon Sep 17 00:00:00 2001 From: ylemkimon Date: Sat, 28 Jul 2018 23:49:36 +0900 Subject: [PATCH] Lint website (#1519) * Lint website * Add comment to empty_thead.js --- .eslintignore | 1 + package-lock.json | 37 ++++++++- package.json | 3 +- website/.eslintrc | 8 ++ website/core/Footer.js | 155 ++++++++++++++++++------------------- website/empty_thead.js | 3 + website/pages/en/users.js | 61 +++++++-------- website/remarkableKatex.js | 77 +++++++++--------- website/siteConfig.js | 94 +++++++++++----------- website/static/js/index.js | 8 +- 10 files changed, 248 insertions(+), 199 deletions(-) create mode 100644 website/.eslintrc diff --git a/.eslintignore b/.eslintignore index a889c718..b682dd05 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,3 @@ **/node_modules/* dist/* +website/build/* diff --git a/package-lock.json b/package-lock.json index 77a2f6e2..f0cab6cf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3646,6 +3646,18 @@ "lodash": "^4.17.10" } }, + "eslint-plugin-react": { + "version": "7.10.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.10.0.tgz", + "integrity": "sha512-18rzWn4AtbSUxFKKM7aCVcj5LXOhOKdwBino3KKWy4psxfPW0YtIbE8WNRDUdyHFL50BeLb6qFd4vpvNYyp7hw==", + "dev": true, + "requires": { + "doctrine": "^2.1.0", + "has": "^1.0.3", + "jsx-ast-utils": "^2.0.1", + "prop-types": "^15.6.2" + } + }, "eslint-scope": { "version": "3.7.1", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-3.7.1.tgz", @@ -4695,9 +4707,9 @@ } }, "has": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/has/-/has-1.0.2.tgz", - "integrity": "sha512-D5/WxwX+SrGfs/fiQn34RAoIZkCLJBDEfBWS1kmTI6G/1mtjhxTBiIiJi8EsKhwaQqKqj7lpKOi3i69tg3P+OQ==", + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", + "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", "dev": true, "requires": { "function-bind": "^1.1.1" @@ -6841,6 +6853,15 @@ "verror": "1.10.0" } }, + "jsx-ast-utils": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.0.1.tgz", + "integrity": "sha1-6AGxs5mF4g//yHtA43SAgOLcrH8=", + "dev": true, + "requires": { + "array-includes": "^3.0.3" + } + }, "jszip": { "version": "3.1.5", "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.1.5.tgz", @@ -9725,6 +9746,16 @@ "integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=", "dev": true }, + "prop-types": { + "version": "15.6.2", + "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz", + "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==", + "dev": true, + "requires": { + "loose-envify": "^1.3.1", + "object-assign": "^4.1.1" + } + }, "proxy-addr": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.3.tgz", diff --git a/package.json b/package.json index b262887e..e8aa4d98 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "cssnano": "^4.0.1", "eslint": "^5.0.0", "eslint-plugin-flowtype": "^2.40.1", + "eslint-plugin-react": "^7.10.0", "file-loader": "^1.1.11", "flow-bin": "^0.77.0", "husky": "^1.0.0-rc.8", @@ -61,7 +62,7 @@ "bin": "cli.js", "scripts": { "test": "npm run prestart && npm run test:lint && npm run test:flow && npm run test:jest", - "test:lint": "eslint katex.js katex.webpack.js cli.js webpack.*.js src static test contrib dockers && stylelint src/katex.less", + "test:lint": "eslint katex.js katex.webpack.js cli.js webpack.*.js src static test contrib dockers website && stylelint src/katex.less", "test:flow": "flow", "test:jest": "jest", "test:jest:watch": "jest --watch", diff --git a/website/.eslintrc b/website/.eslintrc new file mode 100644 index 00000000..d98f0fef --- /dev/null +++ b/website/.eslintrc @@ -0,0 +1,8 @@ +{ + "extends": [ + "plugin:react/recommended" + ], + "rules": { + "react/prop-types": 0 + } +} diff --git a/website/core/Footer.js b/website/core/Footer.js index 6c6e70b7..19ad551a 100644 --- a/website/core/Footer.js +++ b/website/core/Footer.js @@ -8,89 +8,88 @@ const React = require('react'); class Footer extends React.Component { - docUrl(doc, language) { - const baseUrl = this.props.config.baseUrl; - return baseUrl + 'docs/' + (language ? language + '/' : '') + doc; - } + docUrl(doc, language) { + const baseUrl = this.props.config.baseUrl; + return baseUrl + 'docs/' + (language ? language + '/' : '') + doc; + } - pageUrl(doc, language) { - const baseUrl = this.props.config.baseUrl; - return baseUrl + (language ? language + '/' : '') + doc; - } + pageUrl(doc, language) { + const baseUrl = this.props.config.baseUrl; + return baseUrl + (language ? language + '/' : '') + doc; + } - render() { - const currentYear = new Date().getFullYear(); - return ( - - ); - } +
{this.props.config.copyright}
+ + ); + } } module.exports = Footer; diff --git a/website/empty_thead.js b/website/empty_thead.js index 7a048dbc..30cbfa85 100644 --- a/website/empty_thead.js +++ b/website/empty_thead.js @@ -1,3 +1,6 @@ +/** + * Plugin for Remarkable Markdown processor which removes empty thead of tables + */ module.exports = function(md, options) { function removeEmptyThead(state) { const tokens = state.tokens; diff --git a/website/pages/en/users.js b/website/pages/en/users.js index 07a9b388..1bb0bb2b 100644 --- a/website/pages/en/users.js +++ b/website/pages/en/users.js @@ -7,43 +7,42 @@ const React = require('react'); -const CompLibrary = require('../../core/CompLibrary.js'); -const Container = CompLibrary.Container; +const {Container} = require('../../core/CompLibrary.js'); const siteConfig = require(process.cwd() + '/siteConfig.js'); class Users extends React.Component { - render() { - if ((siteConfig.users || []).length === 0) { - return null; - } - const editUrl = siteConfig.repoUrl + '/edit/master/website/siteConfig.js'; - const showcase = siteConfig.users.map((user, i) => { - return ( - - {user.caption} - - ); - }); + render() { + if ((siteConfig.users || []).length === 0) { + return null; + } + const editUrl = siteConfig.repoUrl + '/edit/master/website/siteConfig.js'; + const showcase = siteConfig.users.map((user, i) => { + return ( + + {user.caption} + + ); + }); - return ( -
- -
-
-

Who is Using KaTeX?

-

KaTeX is used by many projects

-
-
{showcase}
-

Are you using KaTeX?

- - Add your project - + return ( +
+ +
+
+

Who is Using KaTeX?

+

KaTeX is used by many projects

+
+
{showcase}
+

Are you using KaTeX?

+ + Add your project + +
+
- -
- ); - } + ); + } } module.exports = Users; diff --git a/website/remarkableKatex.js b/website/remarkableKatex.js index f43afffb..11b4f376 100644 --- a/website/remarkableKatex.js +++ b/website/remarkableKatex.js @@ -22,30 +22,32 @@ SOFTWARE. */ /** - * Plugin for Remarkable Markdown processor which transforms $..$ and $$..$$ sequences into math HTML using the - * Katex package. + * Plugin for Remarkable Markdown processor which transforms $..$ and $$..$$ + * sequences into math HTML using the KaTeX package. */ module.exports = function(md, options) { - var katex = require("../"); + const katex = require("../"); function renderKatex(source, displayMode) { - return katex.renderToString(source, {displayMode: displayMode, throwOnError: false}); + return katex.renderToString(source, {displayMode, throwOnError: false}); } /** - * Parse '$$' as a block. I don't think this is needed since it is already done in the parseInlineKatex - * method. Based off of similar method in remarkable. + * Parse '$$' as a block. Based off of similar method in remarkable. */ function parseBlockKatex(state, startLine, endLine) { - var marker, len, params, nextLine, mem, - haveEndMarker = false, - pos = state.bMarks[startLine] + state.tShift[startLine], - max = state.eMarks[startLine]; - var dollar = 0x24; + let len; + let params; + let nextLine; + let mem; + let haveEndMarker = false; + let pos = state.bMarks[startLine] + state.tShift[startLine]; + let max = state.eMarks[startLine]; + const dollar = 0x24; if (pos + 1 > max) { return false; } - marker = state.src.charCodeAt(pos); + const marker = state.src.charCodeAt(pos); if (marker !== dollar) { return false; } // scan marker length @@ -53,7 +55,7 @@ module.exports = function(md, options) { pos = state.skipChars(pos, marker); len = pos - mem; - if (len != 2) { return false; } + if (len !== 2) { return false; } // search end of block nextLine = startLine; @@ -61,7 +63,6 @@ module.exports = function(md, options) { for (;;) { ++nextLine; if (nextLine >= endLine) { - // unclosed block should be autoclosed by end of document. // also block seems to be autoclosed by end of parent break; @@ -71,14 +72,13 @@ module.exports = function(md, options) { max = state.eMarks[nextLine]; if (pos < max && state.tShift[nextLine] < state.blkIndent) { - // non-empty line with negative indent should stop the list: // - ``` // test break; } - if (state.src.charCodeAt(pos) !== dollar) { continue }; + if (state.src.charCodeAt(pos) !== dollar) { continue; } if (state.tShift[nextLine] - state.blkIndent >= 4) { @@ -102,34 +102,39 @@ module.exports = function(md, options) { break; } - // If a fence has heading spaces, they should be removed from its inner block + // If a fence has heading spaces, they should be removed from + // its inner block len = state.tShift[startLine]; state.line = nextLine + (haveEndMarker ? 1 : 0); - var content = state.getLines(startLine + 1, nextLine, len, true) - .replace(/[ \n]+/g, ' ') - .trim(); + const content = state.getLines(startLine + 1, nextLine, len, true) + .replace(/[ \n]+/g, ' ') + .trim(); state.tokens.push({ type: 'katex', - params: params, - content: content, + params, + content, lines: [startLine, state.line], level: state.level, - block: true + block: true, }); return true; } /** - * Look for '$' or '$$' spans in Markdown text. Based off of the 'fenced' parser in remarkable. + * Look for '$' or '$$' spans in Markdown text. + * Based off of the 'fenced' parser in remarkable. */ function parseInlineKatex(state, silent) { - var dollar = 0x24; - var pos = state.pos; - var start = pos, max = state.posMax, marker, matchStart, matchEnd ; + const dollar = 0x24; + let pos = state.pos; + const start = pos; + const max = state.posMax; + let matchStart; + let matchEnd ; if (state.src.charCodeAt(pos) !== dollar) { return false; } ++pos; @@ -138,7 +143,7 @@ module.exports = function(md, options) { ++pos; } - marker = state.src.slice(start, pos); + const marker = state.src.slice(start, pos); if (marker.length > 2) { return false; } matchStart = matchEnd = pos; @@ -150,17 +155,17 @@ module.exports = function(md, options) { ++matchEnd; } - if (matchEnd - matchStart == marker.length) { + if (matchEnd - matchStart === marker.length) { if (!silent) { - var content = state.src.slice(pos, matchStart) - .replace(/[ \n]+/g, ' ') - .trim(); + const content = state.src.slice(pos, matchStart) + .replace(/[ \n]+/g, ' ') + .trim(); state.push({ type: 'katex', - content: content, + content, block: marker.length > 1, - level: state.level + level: state.level, }); } @@ -169,7 +174,9 @@ module.exports = function(md, options) { } } - if (! silent) state.pending += marker; + if (!silent) { + state.pending += marker; + } state.pos += marker.length; return true; diff --git a/website/siteConfig.js b/website/siteConfig.js index 06885e92..dfcf61f2 100644 --- a/website/siteConfig.js +++ b/website/siteConfig.js @@ -10,73 +10,71 @@ /* List of projects/orgs using your project for the users page */ const users = [ - { - caption: 'GitLab', - image: 'https://gitlab.com/gitlab-com/gitlab-artwork/raw/master/logo/logo-square.png', - infoLink: 'https://gitlab.com/', - pinned: true, - }, + { + caption: 'GitLab', + image: 'https://gitlab.com/gitlab-com/gitlab-artwork/raw/master/logo/logo-square.png', + infoLink: 'https://gitlab.com/', + pinned: true, + }, ]; const siteConfig = { - title: 'KaTeX', - tagline: 'The fastest math typesetting library for the web', - url: 'https://khan.github.io', - baseUrl: '/KaTeX/', + title: 'KaTeX', + tagline: 'The fastest math typesetting library for the web', + url: 'https://khan.github.io', + baseUrl: '/KaTeX/', - // Used for publishing and more - projectName: 'KaTeX', - organizationName: 'Khan', + // Used for publishing and more + projectName: 'KaTeX', + organizationName: 'Khan', - headerLinks: [ - {doc: 'node', label: 'Docs'}, - {page: 'users', label: 'Users'}, - {href: 'https://github.com/Khan/KaTeX', label: 'GitHub'}, - {search: true}, - ], + headerLinks: [ + {doc: 'node', label: 'Docs'}, + {page: 'users', label: 'Users'}, + {href: 'https://github.com/Khan/KaTeX', label: 'GitHub'}, + {search: true}, + ], + users, - // If you have users set above, you add it here: - users, + /* path to images for header/footer */ + headerIcon: 'img/katex-logo.svg', + footerIcon: 'img/katex-logo.svg', + favicon: 'https://khan.github.io/favicon.ico', - /* path to images for header/footer */ - headerIcon: 'img/katex-logo.svg', - footerIcon: 'img/katex-logo.svg', - favicon: 'https://khan.github.io/favicon.ico', + disableHeaderTitle: true, - disableHeaderTitle: true, + /* colors for website */ + colors: { + primaryColor: '#329894', + secondaryColor: '#266e6c', + }, - /* colors for website */ - colors: { - primaryColor: '#329894', - secondaryColor: '#266e6c', - }, - - // This copyright info is used in /core/Footer.js and blog rss/atom feeds. - copyright: + // This copyright info is used in /core/Footer.js and blog rss/atom feeds. + copyright: 'Copyright © ' + new Date().getFullYear() + ' Khan Academy', - highlight: { - // Highlight.js theme to use for syntax highlighting in code blocks - theme: 'default', - }, + highlight: { + // Highlight.js theme to use for syntax highlighting in code blocks + theme: 'default', + }, - markdownPlugins: [require('./remarkableKatex'), require('./empty_thead')], + markdownPlugins: [require('./remarkableKatex'), require('./empty_thead')], - scripts: ['https://buttons.github.io/buttons.js'], - stylesheets: ['https://cdn.jsdelivr.net/npm/katex@0.10.0-beta/dist/katex.min.css'], + scripts: ['https://buttons.github.io/buttons.js'], + stylesheets: ['https://cdn.jsdelivr.net/npm/katex@0.10.0-beta/dist/katex.min.css'], - separateCss: ['static/static', 'static\\static'], + separateCss: ['static/static', 'static\\static'], - /* On page navigation for the current documentation page */ - onPageNav: 'separate', + /* On page navigation for the current documentation page */ + onPageNav: 'separate', - /* Open Graph and Twitter card images */ - ogImage: 'img/og_logo.png', - twitterImage: 'img/og_logo.png', + /* Open Graph and Twitter card images */ + ogImage: 'img/og_logo.png', + twitterImage: 'img/og_logo.png', - repoUrl: 'https://github.com/Khan/KaTeX', + repoUrl: 'https://github.com/Khan/KaTeX', }; module.exports = siteConfig; diff --git a/website/static/js/index.js b/website/static/js/index.js index 70548e59..7c8df100 100644 --- a/website/static/js/index.js +++ b/website/static/js/index.js @@ -1,3 +1,5 @@ +/* eslint-disable no-var */ +/* global katex: false */ window.startup = function() { var tex = document.getElementsByClassName("tex"); Array.prototype.forEach.call(tex, function(el) { @@ -10,10 +12,10 @@ window.startup = function() { function doDemo() { try { katex.render(demoInput.value, demoOutput, { - displayMode: true + displayMode: true, }); - } catch(err) { - while(demoOutput.lastChild) { + } catch (err) { + while (demoOutput.lastChild) { demoOutput.removeChild(demoOutput.lastChild); } var msg = document.createTextNode(err.message);