Add Stylelint checks and checks output consistency #377

Josehower · 2023-04-11T15:14:07Z

Following a similar approach to the ESLint check, this PR adds a check for Stylelint to Preflight. The implemented features are:

Check for warnings and errors in css, sass, scss, less, js, tsx and jsx files
Check the stylelint.config.js file exist and match the template in upleveled-stylelint-config package
UpLeveled Stylelint Config package is updated
Checks are only performed when the project is a React project

In addition This PR updates outputs for ESLint check and Prettier check in order to have a single path format for the output

New UpLeveled Prefilght output:

🚀 UpLeveled Preflight v1.23.3
✔ All changes committed to Git                                                                                                                                                                                                                                      
✔ node_modules/ folder ignored in Git                                                                                                                     
✔ No extraneous files committed to Git                                                                                                                    
✔ No secrets committed to Git                                                                                                                             
✔ Use single package manager                                                                                                                              
✔ Project folder name matches correct format                                                                                                              
✔  No dependency problems                                                                                                                                                                                                                                                                                                                                                
✔ GitHub repo has deployed project link under About                                                                                                       
✖ ESLint
  › ESLint problems found in the following files:
    app/api/hello/route.js

    Open these files in your editor - there should be problems to fix

✖ Stylelint
  › Stylelint problems found in the following files:
    app/globals.css
    app/page.module.css

    Open these files in your editor - there should be problems to fix

✖ Prettier
  › Prettier has not been run in the following files:
    app/api/hello/route.js

    For each of the files above, open the file in your editor and save the file. This will format the file with Prettier, which will cause changes to     
    appear in Git.

    In some very uncommon cases (this probably doesn't apply to you), the mismatch may come from inconsistent end of line characters. Read more here:     
    https://github.com/upleveled/answers/issues/31

✔ ESLint config is latest version
✖ Stylelint config is latest version
  › Your stylelint.config.cjs file does not match the configuration file template - please delete the file and reinstall the config using the instructions on https://www.npmjs.com/package/eslint-config-upleveled
                                                                                                                   
✔ Preflight is latest version

github-actions · 2023-04-11T15:15:31Z

size-limit report 📦

Path	Size
dist/preflight.esm.js	7.59 KB (+4.58% 🔺)

src/checks/stylelint.ts

__tests__/__snapshots__/e2e.test.ts.snap

karlhorky · 2023-04-19T16:25:25Z

src/checks/stylelingConfigIsValid.ts

+module.exports = config;`;
+  } catch (err) {
+    throw new Error(
+      `Error reading your stylelint.config.cjs file. Please reinstall the config using the instructions on https://www.npmjs.com/package/eslint-config-upleveled


I guess this error should mention that the config file should be deleted if it exists

Probably we want to mention this for the same error in the ESLint config check

the period can be changed to this pattern: d242231

karlhorky · 2023-04-19T16:25:29Z

src/checks/stylelingConfigIsValid.ts

+
+  if (!stylelintConfigMatches) {
+    throw new Error(
+      `Your Stylelint config file stylelint.config.cjs does not match the configuration file template. Please reinstall the config using the instructions on https://www.npmjs.com/package/eslint-config-upleveled


I guess this error should mention that the config file should be deleted if it exists

Probably we want to mention this for the same error in the ESLint config check

the period can be changed to this pattern: d242231

karlhorky · 2023-04-19T16:26:30Z

src/checks/stylelingConfigIsValid.ts

+  })) {
+    const fileContents = await fs.readFile(path, 'utf-8');
+    if (
+      /stylelint-disable|stylelint [a-z0-9@/-]+: (0|off)/.test(fileContents)


is the second part of this pattern a valid way to ignore code in Stylelint?

src/checks/stylelingConfigIsValid.ts

karlhorky · 2023-04-19T16:42:54Z

src/index.ts

@@ -87,6 +91,6 @@ await new Listr(listrTasks, {
    removeEmptyLines: false,
    formatOutput: 'wrap',
  },
-  fallbackRenderer: 'verbose',


this is probably a merge mistake

preflight/src/index.ts

Line 94 in 58f22fa

fallbackRenderer: 'verbose',

karlhorky · 2023-04-19T16:45:07Z

new check output:

the output in the description needs to be updated with the Preflight output including Stylelint config check too

This reverts commit 4ad180a.

src/checks/stylelingConfigIsValid.ts

src/index.ts

karlhorky · 2023-04-21T09:43:46Z

src/checks/eslint.ts


    // If no ESLint problems detected, throw the error
-    if (!/^\d+ problems?$/.test(lines[lines.length - 2]!)) {
+    if (!new RegExp(`"${errorKey}":`).test(stdout)) {


this is wrong, it won't fail on warnings

clarification, it looks like errorCount may always exist, but it's relying on an implementation detail to assume that it will always be there when there are problems

instead of checking for two dynamic keys, look at your data when you have no errors, maybe you can see a better way of checking it

src/checks/eslint.ts

src/checks/stylelint.ts

karlhorky · 2023-04-21T09:52:45Z

src/index.ts

@@ -20,6 +22,8 @@ import {
  projectPackageJson,
 } from './util/packageJson.js';

+const projectDependencies = projectPackageJson.dependencies || {};


I actually like this pattern better than what we have, let's copy it over in these 2 places here too:

preflight/src/checks/noDependencyProblems/noDependenciesWithoutTypes.ts

Line 33 in be0499c

const { devDependencies = {}, dependencies = {} } = projectPackageJson;

preflight/src/checks/noDependencyProblems/nextJsProjectHasSharpInstalled.ts

Line 8 in be0499c

projectPackageJson.dependencies!,

done in 560b36a

karlhorky · 2023-04-21T13:46:17Z

src/checks/eslint.ts

+        ${(JSON.parse(stdout) as ESLint.LintResult[])
+          .filter(
+            (eslintResult) =>
+              !(eslintResult[errorKey] === 0 && eslintResult[warningKey] === 0),


how would this be the case? what is a a LintResult which has both errorCount and warningCount both of 0? does this happen in reality?

if it does, then this probably needs a comment describing when this is the case

…int-check

Add stylelint check

7e3aaef

Fix function name

716c456

karlhorky reviewed Apr 11, 2023

View reviewed changes

src/checks/stylelint.ts Outdated Show resolved Hide resolved

karlhorky reviewed Apr 11, 2023

View reviewed changes

src/checks/stylelint.ts Show resolved Hide resolved

Josehower added 3 commits April 12, 2023 10:15

Fix casing on stilelint

6ba0ca6

Merge branch 'main' into add-stylelint-check

12d4edf

Add stylelint config validation

e8323b9

karlhorky reviewed Apr 18, 2023

View reviewed changes

src/checks/stylelint.ts Outdated Show resolved Hide resolved

Josehower added 3 commits April 18, 2023 13:22

Add additional file extentions

0a9492e

Update test

1ce0624

Add exeptions

0e33e62

karlhorky reviewed Apr 18, 2023

View reviewed changes

__tests__/__snapshots__/e2e.test.ts.snap Outdated Show resolved Hide resolved

Merge branch 'main' into add-stylelint-check

ab3a404

Josehower changed the title ~~Add StyleLint check~~ Add Stylelint check Apr 19, 2023

karlhorky reviewed Apr 19, 2023

View reviewed changes

Add colors

9e6adb6

karlhorky reviewed Apr 19, 2023

View reviewed changes

Josehower and others added 2 commits April 19, 2023 18:33

Fix error in colors

efdedc9

Merge branch 'main' into add-stylelint-check

d5ee5cb

karlhorky reviewed Apr 19, 2023

View reviewed changes

src/checks/stylelingConfigIsValid.ts Outdated Show resolved Hide resolved

Josehower added 2 commits April 19, 2023 18:41

Add icons

4ad180a

Merge branch 'main' into add-stylelint-check

100eb41

karlhorky reviewed Apr 19, 2023

View reviewed changes

Revert "Add icons"

fe2703c

This reverts commit 4ad180a.

karlhorky reviewed Apr 19, 2023

View reviewed changes

src/checks/stylelingConfigIsValid.ts Outdated Show resolved Hide resolved

Add falback renderer

121137d

karlhorky reviewed Apr 19, 2023

View reviewed changes

src/checks/stylelingConfigIsValid.ts Outdated Show resolved Hide resolved

karlhorky reviewed Apr 21, 2023

View reviewed changes

src/index.ts Outdated Show resolved Hide resolved

karlhorky reviewed Apr 21, 2023

View reviewed changes

src/index.ts Outdated Show resolved Hide resolved

karlhorky reviewed Apr 21, 2023

View reviewed changes

Fix potential break

778935c

karlhorky reviewed Apr 21, 2023

View reviewed changes

src/checks/eslint.ts Outdated Show resolved Hide resolved

karlhorky reviewed Apr 21, 2023

View reviewed changes

src/checks/stylelint.ts Outdated Show resolved Hide resolved

karlhorky and others added 3 commits April 21, 2023 11:48

Update noDependenciesWithoutTypes.ts

f15f743

Fix warning

514f855

Move comment over the map

90bbed5

This comment was marked as duplicate.

Sign in to view

karlhorky reviewed Apr 21, 2023

View reviewed changes

Update pattern

393195c

karlhorky reviewed Apr 21, 2023

View reviewed changes

karlhorky and others added 14 commits April 21, 2023 16:25

Simplify path manipulation

d3e8412

2.1.0-0

761243f

Add Windows paths examples

505c565

Fix paths, add windows path

b7b1fc8

Remove obsolete ignored files

c2edc82

Parse the output to do more clear checks

6f20af3

Update stylelint check and fix errors

83189bc

Validate ESLint JSON data for another edge case

f18804d

Improve comment clarity

bec907d

Fix spelling error

e9ecf51

Copy pattern

560b36a

Verify shape of Stylelint data earlier

3b08941

Merge branch 'main' into add-stylelint-check

7a1eb7a

Merge branch 'main' of github.com:upleveled/preflight into add-stylel…

1a2ff81

…int-check

karlhorky approved these changes Apr 21, 2023

View reviewed changes

karlhorky merged commit 675c0b4 into main Apr 21, 2023

karlhorky deleted the add-stylelint-check branch April 21, 2023 17:14

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add Stylelint checks and checks output consistency #377

Add Stylelint checks and checks output consistency #377

Josehower commented Apr 11, 2023 •

edited

Loading

github-actions bot commented Apr 11, 2023 •

edited

Loading

karlhorky Apr 19, 2023 •

edited

Loading

Josehower Apr 20, 2023

karlhorky Apr 19, 2023 •

edited

Loading

Josehower Apr 20, 2023

karlhorky Apr 19, 2023

Josehower Apr 20, 2023

karlhorky Apr 19, 2023

Josehower Apr 20, 2023

karlhorky commented Apr 19, 2023

karlhorky Apr 21, 2023

karlhorky Apr 21, 2023

karlhorky Apr 21, 2023

This comment was marked as duplicate.

karlhorky Apr 21, 2023 •

edited

Loading

karlhorky Apr 21, 2023

karlhorky Apr 21, 2023

Add Stylelint checks and checks output consistency #377

Add Stylelint checks and checks output consistency #377

Conversation

Josehower commented Apr 11, 2023 • edited Loading

github-actions bot commented Apr 11, 2023 • edited Loading

size-limit report 📦

karlhorky Apr 19, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

karlhorky Apr 19, 2023 • edited Loading

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

karlhorky commented Apr 19, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

This comment was marked as duplicate.

karlhorky Apr 21, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Josehower commented Apr 11, 2023 •

edited

Loading

github-actions bot commented Apr 11, 2023 •

edited

Loading

karlhorky Apr 19, 2023 •

edited

Loading

karlhorky Apr 19, 2023 •

edited

Loading

karlhorky Apr 21, 2023 •

edited

Loading