add new lint rules to ease migration #2394

giladgray · 2018-04-16T19:20:39Z

Fixes #2393

two new lint rules (with tests!!) in @blueprintjs/tslint-config package:
1. blueprint-classes-constants enforces use of Classes.* constants instead of "pt-prefixed-strings".
2. blueprint-icon-components enforces icon="tick" or icon={<TickIcon />} usage (requires [icons] Enable tree-shaking for SVG icons #2356 for icon components). this rule is disabled in the default config, as it's an opt-in decision to ensure tree shaking of icons is possible.
remove default file-header rule config as it references Palantir (still exists in the repo config).
fix lint errors in our codebase

Check out the README for usage instructions.

blueprint-bot · 2018-04-16T19:23:19Z

fix lint errors in our codebase due to classes-constants

Preview: documentation | landing | table

blueprint-bot · 2018-04-16T19:33:30Z

move stuff inside rules/ dirs, compile to lib/rules/

Preview: documentation | landing | table

jkillian · 2018-04-16T19:35:50Z

packages/tslint-config/src/rules/blueprintClassesConstantsRule.ts

@@ -0,0 +1,42 @@
+/*


hmm, this package is only intended for @blueprintjs packages, right? So it doesn't make sense to put rules that will be consumed by end-user apps here, does it?

🤔 after this PR, it will contain some blueprint-specific rules, but this package is intended for consumption by who-so-ever wishes.

i proposed putting these rules here or in core itself and we agreed that this package makes more sense as it actually depends on tslint. i'll migrate the internal tslint-config to depend on this (where most of the config came from in the first place).

https://github.com/palantir/tslint-blueprint was designed for rules like this, consider putting these there

Seems a little late for that! Looks like that package already has this rule. But makes sense for these things to live in the blueprint repo, no?

Also 👋👋 hi @adidahiya!!

blueprint-bot · 2018-04-16T21:03:41Z

move rules to new tslint-rules package

Preview: documentation | landing | table

blueprint-bot · 2018-04-16T21:11:18Z

test linting failures

Preview: documentation | landing | table

blueprint-bot · 2018-04-16T21:22:44Z

compile rules before linting in CI

Preview: documentation | landing | table

blueprint-bot · 2018-04-16T21:27:15Z

another lint test

Preview: documentation | landing | table

giladgray · 2018-04-16T21:41:08Z

packages/core/src/accessibility/focusStyleManager.ts

@@ -16,7 +14,7 @@ const fakeFocusEngine = {

 const focusEngine =
    typeof document !== "undefined"
-        ? new InteractionModeEngine(document.documentElement, FOCUS_DISABLED_CLASS)
+        ? new InteractionModeEngine(document.documentElement, "pt-focus-disabled")


expecting lint failure

success ✅

giladgray · 2018-04-16T21:41:49Z

packages/tslint-config/blueprint-rules.js

+ */
+
+/**
+ * Enable Blueprint-specific TSLint rules defined in this package.


@jkillian @rcchen new top-level file in this package that configures blueprint-specific rules.

blueprint-bot · 2018-04-16T21:46:32Z

move code back to tslint-config, add blueprint-rules.js module

Preview: documentation | landing | table

blueprint-bot · 2018-04-16T21:54:16Z

re-fix linting

Preview: documentation | landing | table

jkillian · 2018-04-16T22:11:44Z

packages/tslint-config/README.md

+{
+  "extends": [
+    "@blueprintjs/tslint-config",
+    "@blueprintjs/tslint-config/blueprint-rules"


I would add an example with only this line and make it the basic usage example. There will be a lot more people I think who will want to just use the BP rules than use all the rules.

i'll def add a note that the rules can be used on their own

jkillian · 2018-04-16T22:13:04Z

packages/tslint-config/index.js

@@ -25,11 +25,6 @@ module.exports = {
                // ["assert", "equal", "use assert.strictEqual instead"]


this file should extend blueprint-rules.js, right?

no i thought that was the whole point of this... that the base config does not include any blueprint-specific stuff?

nah, the purpose is the inverse of that actually, that you can use the blueprint-specific rules (such as no icon strings) without pulling in the rest of the config

ok so default config includes blueprint, but you can also just use blueprint without config?

yep! because most apps using BP are going to want to pick up the BP rules and config that say "don't use the .pt- prefix" but not pick up the general TS lint rule config

giladgray · 2018-04-16T22:13:11Z

Check out the README for usage instructions.

jkillian · 2018-04-16T22:15:01Z

packages/tslint-config/src/rules/blueprintIconComponentsRule.ts

+    };
+    // tslint:enable:object-literal-sort-keys
+
+    public static COMPONENT_MESSAGE = "use <NameIcon /> component for icon prop";


sort of makes me think <NameIcon /> is an actual component

i might be able to improve the messaging here so it actually mentions icon name, but we gotta merge #2356 first. and i def want to add a fixer for this.

well now it's NamedIcon

blueprint-bot · 2018-04-16T22:15:07Z

add README and LICENSE to tslint-config package

Preview: documentation | landing | table

blueprint-bot · 2018-04-16T22:16:40Z

🤖 remove default file-header config for non-palantir users

Preview: documentation | landing | table

themadcreator

nits

themadcreator · 2018-04-16T22:14:02Z

.circleci/config.yml

@@ -51,6 +51,7 @@ jobs:
          keys:
            - v7-dependency-cache-{{ checksum "yarn.lock" }}
            - v7-dependency-cache-
+      - run: yarn compile --scope "@blueprintjs/tslint*"


since circle runs yarn compile above with no scope, shouldn't this already be done?

lint and compile run in parallel so they don't affect each other 😢

themadcreator · 2018-04-16T22:16:01Z

packages/core/test/spinner/spinnerTests.tsx

@@ -26,7 +26,10 @@ describe("Spinner", () => {
    it("value sets stroke-dashoffset", () => {
        // dash offset = X * (1 - value)
        const root = mount(<Spinner value={0.35} />);
-        assert.isTrue(root.find(`.${Classes.SPINNER}`).hasClass(Classes.SPINNER_NO_SPIN), "missing class pt-no-spin");
+        assert.isTrue(
+            root.find(`.${Classes.SPINNER}`).hasClass(Classes.SPINNER_NO_SPIN),


will this also fail if the class can't be found? (i'm trying to infer why assert.isTrue was used...

"assert that the spinner is not spinning"

themadcreator · 2018-04-16T22:16:52Z

packages/datetime/test/dateInputTests.tsx

@@ -336,11 +336,11 @@ describe("<DateInput>", () => {
            wrapper.setState({ isOpen: true });

            // try typing a new time
-            wrapper.find(".pt-timepicker-millisecond").simulate("change", { target: { value: "1" } });
+            wrapper.find("." + Classes.TIMEPICKER_MILLISECOND).simulate("change", { target: { value: "1" } });


nit: we use backtick interpolation elsewhere. might as well be consistent.

themadcreator · 2018-04-16T22:18:44Z

packages/table/src/layers/guides.tsx

@@ -52,7 +52,7 @@ export class GuideLayer extends React.Component<IGuideLayerProps, {}> {
            left: `${offset}px`,
        };
        const className = classNames(Classes.TABLE_OVERLAY, Classes.TABLE_VERTICAL_GUIDE, {
-            "pt-table-vertical-guide-flush-left": offset === 0,
+            [`${Classes.TABLE_VERTICAL_GUIDE}-flush-left`]: offset === 0,


nit: since our classes have configurable PREFIX, then this will technically work, but it's worth noting this is slightly different that the other uses since we're building a classname string.

reiv · 2018-04-17T16:22:30Z

packages/tslint-config/README.md

+const element = <div className={Classes.NAVBAR} />;
+```
+
+```json


Change json to js to disable highlighting error? Vanilla JSON doesn't allow comments.

json5 will also work

blueprint-bot · 2018-04-18T00:42:00Z

major readme edits

Preview: documentation | landing | table

blueprint-bot · 2018-04-18T01:13:41Z

add fixers to icon-components rule!

Preview: documentation | landing | table

blueprint-bot · 2018-04-18T21:40:23Z

revert tslint config change, lint

Preview: documentation | landing | table

Gilad Gray added 9 commits April 15, 2018 19:11

create blueprint-specific lint rules in tsling-config pkg

fbc5fb1

blueprint-icon-components impl & options & tests

f31f098

icon-components only applies to icon props

1bab25e

blueprint-classes-constants impl & tests

f5cf2d4

add test script & dep to package.json

086914c

replace test-rules script file with tslint --test glob

cd9bdab

update npmignore

0eed2a8

disable icon-components rule by default

8f7de99

fix lint errors in our codebase due to classes-constants

c425b97

giladgray requested review from rcchen and jkillian April 16, 2018 19:20

move stuff inside rules/ dirs, compile to lib/rules/

537f519

jkillian reviewed Apr 16, 2018

View reviewed changes

move rules to new tslint-rules package

efa54b3

test linting failures

3ecccfa

Gilad Gray added 2 commits April 16, 2018 14:17

compile rules before linting in CI

ebd4ff8

another lint test

6254e7d

Gilad Gray added 2 commits April 16, 2018 14:35

use root tslint.json config file

0ae1f97

move code back to tslint-config, add blueprint-rules.js module

1ce4d8d

giladgray commented Apr 16, 2018

View reviewed changes

re-fix linting

bdb5735

Gilad Gray added 3 commits April 16, 2018 15:02

icon-components "enum" option => "literal" (it's not an enum)

1925ebf

add README and LICENSE to tslint-config package

b90c870

remove default file-header config for non-palantir users

e7e6661

jkillian reviewed Apr 16, 2018

View reviewed changes

themadcreator approved these changes Apr 16, 2018

View reviewed changes

giladgray mentioned this pull request Apr 16, 2018

[icons] Enable tree-shaking for SVG icons #2356

Closed

reiv reviewed Apr 17, 2018

View reviewed changes

Gilad Gray added 5 commits April 17, 2018 17:08

interpolate

c039df2

use tslint object option syntax

92ebaa6

icon rule cleanup

689aa67

index config extends blueprint-rules

f96fc1b

major readme edits

2ecd03a

Gilad Gray added 3 commits April 17, 2018 17:43

remove todo

82189f0

formatting

b7f7008

add fixers to icon-components rule!

6f31a13

revert tslint config change, lint

5480d98

giladgray merged commit c8e52b8 into develop Apr 18, 2018

giladgray deleted the gg/lint-rules branch April 18, 2018 21:52

giladgray mentioned this pull request Apr 19, 2018

Prepare release v2.2.0 #2411

Merged

adidahiya mentioned this pull request Jan 22, 2020

chore: convert custom tslint rules to eslint #3917

Merged

		@@ -25,11 +25,6 @@ module.exports = {
		// ["assert", "equal", "use assert.strictEqual instead"]

add new lint rules to ease migration #2394

add new lint rules to ease migration #2394

Conversation

giladgray commented Apr 16, 2018 • edited Loading

Fixes #2393

Check out the README for usage instructions.

blueprint-bot commented Apr 16, 2018

fix lint errors in our codebase due to classes-constants

blueprint-bot commented Apr 16, 2018

move stuff inside rules/ dirs, compile to lib/rules/

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

blueprint-bot commented Apr 16, 2018

move rules to new tslint-rules package

blueprint-bot commented Apr 16, 2018

test linting failures

blueprint-bot commented Apr 16, 2018

compile rules before linting in CI

blueprint-bot commented Apr 16, 2018

another lint test

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

blueprint-bot commented Apr 16, 2018

move code back to tslint-config, add blueprint-rules.js module

blueprint-bot commented Apr 16, 2018

re-fix linting

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

giladgray commented Apr 16, 2018

Check out the README for usage instructions.

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

blueprint-bot commented Apr 16, 2018

add README and LICENSE to tslint-config package

blueprint-bot commented Apr 16, 2018 • edited by giladgray Loading

🤖 remove default file-header config for non-palantir users

themadcreator left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

blueprint-bot commented Apr 18, 2018

major readme edits

blueprint-bot commented Apr 18, 2018

add fixers to icon-components rule!

blueprint-bot commented Apr 18, 2018

revert tslint config change, lint

giladgray commented Apr 16, 2018 •

edited

Loading

blueprint-bot commented Apr 16, 2018 •

edited by giladgray

Loading