Merge pull request #93 from markcheret/automated-linting

build: add automated JS/CSS linting
This commit is contained in:
Mark Cheret 2021-04-15 23:10:30 +02:00 committed by GitHub
commit 6a32c828e1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 6955 additions and 92 deletions

6
.eslintignore Normal file
View file

@ -0,0 +1,6 @@
dist/
docs/
vendor/
node_modules/
*.min.js
jquery.tools.js

12
.eslintrc.js Normal file
View file

@ -0,0 +1,12 @@
module.exports = {
env: {
browser: true,
jquery: true,
es6: true
},
extends: [
'wordpress',
'plugin:prettier/recommended', // Enables eslint-plugin-prettier and displays prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
],
rules: {},
};

View file

@ -32,6 +32,13 @@ jobs:
- name: Lint PHP code - name: Lint PHP code
run: composer run lint:php run: composer run lint:php
- name: Lint JS code
run: composer run format:js:fix && composer run lint:js
# TODO: Fix CSS errors
#- name: Format and lint CSS code
# run: composer run lint:css
# TODO: Add tests # TODO: Add tests
# - name: Run test suite # - name: Run test suite
# run: composer run-script test # run: composer run-script test

1
.gitignore vendored
View file

@ -1,5 +1,6 @@
.phpdoc/ .phpdoc/
vendor/ vendor/
node_modules/
dist/ dist/
tmp/ tmp/

6
.prettierignore Normal file
View file

@ -0,0 +1,6 @@
dist/
docs/
vendor/
node_modules/
*.min.js
jquery.tools.js

7
.prettierrc Normal file
View file

@ -0,0 +1,7 @@
{
"semi": true,
"trailingComma": "all",
"singleQuote": true,
"printWidth": 120,
"tabWidth": 2
}

5
.stylelintignore Normal file
View file

@ -0,0 +1,5 @@
dist/
docs/
vendor/
node_modules/
*.min.css

3
.stylelintrc.json Normal file
View file

@ -0,0 +1,3 @@
{
"extends": "stylelint-config-wordpress"
}

View file

@ -42,7 +42,7 @@ This Plugin provides:
1. Read the [contributing guidelines][contributing]; 1. Read the [contributing guidelines][contributing];
1. clone this repository (`git clone git@github.com:markcheret/footnotes.git`): 1. clone this repository (`git clone git@github.com:markcheret/footnotes.git`):
- we recommend that you use [VVV][vvv] for your local testing environment. - we recommend that you use [VVV][vvv] for your local testing environment.
1. install [Composer][composer], if you don't have it already; and 1. install [Composer][composer] and [NPM][npm]; and
1. install all dependencies (`composer install`): 1. install all dependencies (`composer install`):
- you will have to install `php-mbstring` manually if you do not already - you will have to install `php-mbstring` manually if you do not already
have it. have it.
@ -80,7 +80,15 @@ Automated testing will be introduced soon.
This repo. uses pre-commit code formatting and linting on all staged files. This repo. uses pre-commit code formatting and linting on all staged files.
This ensures that only style-conformant code can be committed. This ensures that only style-conformant code can be committed.
The individual commands used by the pre-commit hook can also be called manually: The individual commands can also be called manually:
- Run `composer run format` to run all format commands.
- Run `composer run format:fix` to attempt to automatically fix all formatter warnings
and errors.
- Run `composer run lint` to run all linting commands.
- Run `composer run lint:fix` to attempt to automatically fix all linter warnings and
errors.
### PHP Code ### PHP Code
@ -94,13 +102,25 @@ PHP code must follow the [WordPress PHP Coding Standards][wpcs-php].
JavaScript code must follow the [WordPress JavaScript Coding Standards][wpcs-js]. JavaScript code must follow the [WordPress JavaScript Coding Standards][wpcs-js].
Automated linting and formatting will be introduced soon. - Run `composer run format:js` to format all JS files with [Prettier][prettier].
- Run `composer run format:js:fix` to attempt to automatically fix warnings and errors.
- Run `composer run lint:js` to lint all JS files with [ESLint][eslint].
- Run `composer run lint:js:fix` to attempt to automatically fix warnings and errors.
Prettier configuration settings are found in `.prettierrc`.
ESLint configuration settings are found in `.eslintrc.js`. File ignore rules are
found in `.eslintignore`.
### CSS Stylesheets ### CSS Stylesheets
JavaScript code must follow the [WordPress CSS Coding Standards][wpcs-css]. JavaScript code must follow the [WordPress CSS Coding Standards][wpcs-css].
Automated linting and formatting will be introduced soon. - Run `composer run lint:css` to format all CSS files with [stylelint][stylelint].
- Run `npcomposerm run lint:css:fix` to attempt to automatically fix warnings and errors.
stylelint configuration settings are found in `.stylelint.json`.
## Documentation ## Documentation
@ -129,10 +149,14 @@ This project is licensed under the [GNU GPL v3][gpl-v3].
[contributing]: https://github.com/markcheret/footnotes/blob/main/CONTRIBUTING.md [contributing]: https://github.com/markcheret/footnotes/blob/main/CONTRIBUTING.md
[vvv]: https://varyingvagrantvagrants.org/ [vvv]: https://varyingvagrantvagrants.org/
[composer]: https://getcomposer.org/download/ [composer]: https://getcomposer.org/download/
[npm]: https://www.npmjs.com/
[wpcs-php]: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/php/ [wpcs-php]: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/php/
[phpcs]: https://github.com/squizlabs/PHP_CodeSniffer [phpcs]: https://github.com/squizlabs/PHP_CodeSniffer
[wpcs-js]: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/javascript/ [wpcs-js]: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/javascript/
[wpcs-css]: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/css/ [wpcs-css]: https://developer.wordpress.org/coding-standards/wordpress-coding-standards/css/
[prettier]: https://prettier.io/
[eslint]: https://eslint.org/
[stylelint]: https://stylelint.io/
[phpdocumentor]: https://phpdoc.org/ [phpdocumentor]: https://phpdoc.org/
[footnotes-docs]: https://markcheret.github.io/footnotes/ [footnotes-docs]: https://markcheret.github.io/footnotes/
[gpl-v3]: https://www.gnu.org/licenses/gpl-3.0.en.html [gpl-v3]: https://www.gnu.org/licenses/gpl-3.0.en.html

View file

@ -6,13 +6,21 @@
"release": "./_tools/release.sh", "release": "./_tools/release.sh",
"release:commit": "composer run release -- -c", "release:commit": "composer run release -- -c",
"build": "./_tools/build.sh", "build": "./_tools/build.sh",
"lint": "composer run lint:php && npm run lint",
"lint:fix": "composer run lint:php:fix && npm run lint:fix",
"format": "npm run format",
"format:fix": "npm run format:fix",
"lint:php": "./vendor/bin/phpcs --standard='WordPress' --colors --encoding=utf-8 -n -p --ignore=*/vendor/* ./*.php ./*/*.php ./*/*/*.php", "lint:php": "./vendor/bin/phpcs --standard='WordPress' --colors --encoding=utf-8 -n -p --ignore=*/vendor/* ./*.php ./*/*.php ./*/*/*.php",
"lint:php:fix": "./vendor/bin/phpcbf --standard='WordPress' --encoding=utf-8 -p --ignore=*/vendor/* ./*.php ./*/*.php ./*/*/*.php", "lint:php:fix": "./vendor/bin/phpcbf --standard='WordPress' --encoding=utf-8 -p --ignore=*/vendor/* ./*.php ./*/*.php ./*/*/*.php",
"lint:css": "echo TODO", "lint:css": "npm run lint:css",
"lint:js": "echo TODO", "lint:css:fix": "npm run lint:css:fix",
"lint:js": "npm run lint:js",
"lint:js:fix": "npm run lint:js:fix",
"format:js": "npm run format:js",
"format:js:fix": "npm run format:js:fix",
"docs": "./vendor/bin/phpdoc -d . -t ./docs --ignore vendor/", "docs": "./vendor/bin/phpdoc -d . -t ./docs --ignore vendor/",
"commit": "./vendor/bin/php-commitizen commit -- ./.php-commitizen.php", "commit": "./vendor/bin/php-commitizen commit -- ./.php-commitizen.php",
"post-install-cmd": "./_tools/setup.sh" "post-install-cmd": "npm install && ./_tools/setup.sh"
}, },
"require-dev": { "require-dev": {
"dealerdirect/phpcodesniffer-composer-installer": "^0.7.1", "dealerdirect/phpcodesniffer-composer-installer": "^0.7.1",

13
composer.lock generated
View file

@ -1400,19 +1400,20 @@
}, },
{ {
"name": "marcocesarato/php-conventional-changelog", "name": "marcocesarato/php-conventional-changelog",
"version": "v1.9.10", "version": "1.10.1",
"source": { "source": {
"type": "git", "type": "git",
"url": "https://github.com/marcocesarato/php-conventional-changelog.git", "url": "https://github.com/marcocesarato/php-conventional-changelog.git",
"reference": "ecf53957bd84126f024f261c4b2fef4a889aafd2" "reference": "c84d617e0081db7d390cab585facb703f0ea9536"
}, },
"dist": { "dist": {
"type": "zip", "type": "zip",
"url": "https://api.github.com/repos/marcocesarato/php-conventional-changelog/zipball/ecf53957bd84126f024f261c4b2fef4a889aafd2", "url": "https://api.github.com/repos/marcocesarato/php-conventional-changelog/zipball/c84d617e0081db7d390cab585facb703f0ea9536",
"reference": "ecf53957bd84126f024f261c4b2fef4a889aafd2", "reference": "c84d617e0081db7d390cab585facb703f0ea9536",
"shasum": "" "shasum": ""
}, },
"require": { "require": {
"ext-json": "*",
"php": ">=7.1.3", "php": ">=7.1.3",
"symfony/console": "^4 || ^5" "symfony/console": "^4 || ^5"
}, },
@ -1467,9 +1468,9 @@
], ],
"support": { "support": {
"issues": "https://github.com/marcocesarato/php-conventional-changelog/issues", "issues": "https://github.com/marcocesarato/php-conventional-changelog/issues",
"source": "https://github.com/marcocesarato/php-conventional-changelog/tree/v1.9.10" "source": "https://github.com/marcocesarato/php-conventional-changelog/tree/v1.10.1"
}, },
"time": "2021-04-13T19:48:52+00:00" "time": "2021-04-15T12:15:06+00:00"
}, },
{ {
"name": "monolog/monolog", "name": "monolog/monolog",

View file

@ -26,7 +26,8 @@ span.footnote_referrer > span.footnote_tooltip {
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
transition-property: visibility, opacity; transition-property: visibility, opacity;
/*
/*
transition-delay: 500ms; transition-delay: 500ms;
transition-duration: 1s; transition-duration: 1s;
*/ */
@ -37,7 +38,8 @@ span.footnote_referrer:hover > span.footnote_tooltip {
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;
transition-property: visibility, opacity; transition-property: visibility, opacity;
/*
/*
transition-delay: 0; transition-delay: 0;
transition-duration: 200ms; transition-duration: 200ms;
*/ */
@ -57,7 +59,8 @@ span.footnote_referrer:hover > span.footnote_tooltip {
.footnote_tooltip.position { .footnote_tooltip.position {
display: unset; display: unset;
position: absolute; position: absolute;
/*
/*
bottom: 24px; bottom: 24px;
left: -50px; left: -50px;
width: 400px; width: 400px;

View file

@ -80,7 +80,7 @@
border: 4px solid red; border: 4px solid red;
padding: 20px 40px; padding: 20px 40px;
margin: 20px 0; margin: 20px 0;
background: #ff000055; background: #f005;
text-align: start; text-align: start;
} }
@ -306,18 +306,19 @@ Classes:
margin-bottom: 0.25em !important; margin-bottom: 0.25em !important;
padding: 0 !important; padding: 0 !important;
font-weight: normal !important; font-weight: normal !important;
/* bottom border optional since 2.2.5 */ /* bottom border optional since 2.2.5 */
display: block !important; display: block !important;
-webkit-margin-before: 0.83em !important; -webkit-margin-before: 0.83em !important;
-webkit-margin-after: 0.83em !important; -webkit-margin-after: 0.83em !important;
-webkit-margin-start: 0px !important; -webkit-margin-start: 0 !important;
-webkit-margin-end: 0px !important; -webkit-margin-end: 0 !important;
text-align: start !important; text-align: start !important;
vertical-align: middle; vertical-align: middle;
} }
.footnote_container_prepare > p > span:first-child, .footnote_container_prepare > p > span:first-child,
.footnote_container_prepare > p > span:nth-child(3) { .footnote_container_prepare > p > span:nth-child(3) {
text-align: start !important; text-align: start !important;
font-size: 1.5em !important; font-size: 1.5em !important;
} }
@ -379,8 +380,8 @@ table
width: 1px !important; width: 1px !important;
white-space: nowrap !important; white-space: nowrap !important;
overflow: hidden !important; overflow: hidden !important;
color: #ffffff00 !important; color: #fff0 !important;
background-color: #ffffff00 !important; background-color: #fff0 !important;
} }
/** /**

View file

@ -23,7 +23,8 @@
.footnote_tooltip.position { .footnote_tooltip.position {
display: unset; display: unset;
position: absolute; position: absolute;
/*
/*
bottom: 24px; bottom: 24px;
left: -50px; left: -50px;
width: 400px; width: 400px;
@ -43,7 +44,8 @@
opacity: 1; opacity: 1;
transition-property: visibility, opacity; transition-property: visibility, opacity;
transition-timing-function: linear; transition-timing-function: linear;
/*
/*
transition-delay: 0ms; transition-delay: 0ms;
transition-duration: 200ms; transition-duration: 200ms;
*/ */
@ -54,7 +56,8 @@
opacity: 0; opacity: 0;
transition-property: visibility, opacity; transition-property: visibility, opacity;
transition-timing-function: linear; transition-timing-function: linear;
/*
/*
transition-delay: 400ms; transition-delay: 400ms;
transition-duration: 200ms; transition-duration: 200ms;
*/ */

View file

@ -3,7 +3,6 @@
* Additional stylesheet needed when tooltips (jQuery or alternative) are enabled. * Additional stylesheet needed when tooltips (jQuery or alternative) are enabled.
* *
* @version 2.5.8 * @version 2.5.8
*
* System of unified minified style sheets tailored to the instance. * System of unified minified style sheets tailored to the instance.
* @since 2.5.5 * @since 2.5.5
* @see full header in dev-common.css. * @see full header in dev-common.css.

View file

@ -28,17 +28,20 @@
text-decoration: none; text-decoration: none;
font-weight: normal; font-weight: normal;
} }
.footnotes_logo_part1_heading { .footnotes_logo_part1_heading {
left: 20px; left: 20px;
color: #2bb975; color: #2bb975;
} }
.footnotes_logo_part2_heading { .footnotes_logo_part2_heading {
left: 51px; left: 51px;
color: #545f5a; color: #545f5a;
} }
.footnotes_heart_heading { .footnotes_heart_heading {
color:#ff6d3b; color: #ff6d3b;
font-weight:bold; font-weight: bold;
position: absolute; position: absolute;
left: 96px; left: 96px;
} }
@ -59,6 +62,7 @@ On User Request:
Limited to a number of IDs to not affect all dashboards Limited to a number of IDs to not affect all dashboards
<https://wordpress.org/support/topic/all-input-have-width-80/> <https://wordpress.org/support/topic/all-input-have-width-80/>
*/ */
/*input[type=text], input[type=password], textarea, select*/ /*input[type=text], input[type=password], textarea, select*/
#footnote_inputfield_readon_label, #footnote_inputfield_readon_label,
#footnote_inputfield_references_label, #footnote_inputfield_references_label,
@ -82,6 +86,7 @@ Limited to a number of IDs to not affect all dashboards
#footnote_inputfield_custom_mouse_over_box_excerpt_length { #footnote_inputfield_custom_mouse_over_box_excerpt_length {
width: 180px; width: 180px;
} }
#footnote_inputfield_placeholder_start_user_defined, #footnote_inputfield_placeholder_start_user_defined,
#footnote_inputfield_placeholder_end_user_defined { #footnote_inputfield_placeholder_end_user_defined {
width: 320px; width: 320px;
@ -147,7 +152,7 @@ label {
border: none !important; border: none !important;
} }
.postbox > .inside >table > tbody > tr > td:first-child { .postbox > .inside > table > tbody > tr > td:first-child {
width: 15% !important; width: 15% !important;
font-weight: bold !important; font-weight: bold !important;
} }
@ -182,17 +187,21 @@ IE doesnt support nth child, but these are not critical
.expert_lookup tr td:first-child { .expert_lookup tr td:first-child {
width: 170px !important; width: 170px !important;
} }
.expert_lookup tr th:nth-child(2), .expert_lookup tr th:nth-child(2),
.expert_lookup tr td:nth-child(2) { .expert_lookup tr td:nth-child(2) {
width: 65px !important; width: 65px !important;
} }
.expert_lookup tr th:nth-child(3), .expert_lookup tr th:nth-child(3),
.expert_lookup tr td:nth-child(3) { .expert_lookup tr td:nth-child(3) {
width: 200px !important; width: 200px !important;
} }
.expert_lookup tr td:nth-child(3) input { .expert_lookup tr td:nth-child(3) input {
width: 190px; width: 190px;
} }
.expert_lookup tr th:last-child, .expert_lookup tr th:last-child,
.expert_lookup tr td:last-child { .expert_lookup tr td:last-child {
white-space: nowrap; white-space: nowrap;
@ -219,22 +228,26 @@ helping edit CSS, like tab support and syntactic colors.
width: 38% !important; width: 38% !important;
font-weight: normal !important; font-weight: normal !important;
} }
.customize_css_new tr td:first-child span:first-child { .customize_css_new tr td:first-child span:first-child {
font-weight: bold !important; font-weight: bold !important;
} }
.customize_css_new .list { .customize_css_new .list {
padding-top: 10px; padding-top: 10px;
} }
.customize_css_new .list p { .customize_css_new .list p {
font-family: monospace; font-family: monospace;
padding: 0 10px; padding: 0 10px;
text-indent: -10px; text-indent: -10px;
margin: .5em 0; margin: 0.5em 0;
} }
#footnote_inputfield_custom_css_new { #footnote_inputfield_custom_css_new {
height: 500px; height: 500px;
} }
#footnote_inputfield_custom_css, #footnote_inputfield_custom_css,
#footnote_inputfield_custom_css_new { #footnote_inputfield_custom_css_new {
width: 96%; width: 96%;
@ -276,6 +289,7 @@ notice after the end of the settings box.
.footnotes_description { .footnotes_description {
padding: 0 4%; padding: 0 4%;
} }
.footnotes_description p { .footnotes_description p {
font-size: 1.06em; font-size: 1.06em;
font-style: italic; font-style: italic;

View file

@ -4,7 +4,7 @@
* Edit: be careful to maintain version number near EOF * Edit: be careful to maintain version number near EOF
*/ */
(function() { (function () {
tinymce.create('tinymce.plugins.Footnotes', { tinymce.create('tinymce.plugins.Footnotes', {
/** /**
* Initializes the plugin, this will be executed after the plugin has been created. * Initializes the plugin, this will be executed after the plugin has been created.
@ -14,28 +14,28 @@
* @param {tinymce.Editor} ed Editor instance that the plugin is initialized in. * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in.
* @param {string} url Absolute URL to where the plugin is located. * @param {string} url Absolute URL to where the plugin is located.
*/ */
init : function(ed, url) { init: function (ed, url) {
ed.addButton('footnotes', { ed.addButton('footnotes', {
title : 'footnotes', title: 'footnotes',
cmd : 'footnotes', cmd: 'footnotes',
image : url + '/../img/fn-wysiwyg.png' image: url + '/../img/fn-wysiwyg.png',
}); });
ed.addCommand('footnotes', function() { ed.addCommand('footnotes', function () {
jQuery.ajax({ jQuery.ajax({
type: 'POST', type: 'POST',
url: './admin-ajax.php', url: './admin-ajax.php',
data: { data: {
action: 'footnotes_getTags' action: 'footnotes_getTags',
}, },
success: function(data, textStatus, XMLHttpRequest){ success: function (data, textStatus, XMLHttpRequest) {
var l_arr_Tags = JSON.parse(data); var tags = JSON.parse(data);
var return_text = l_arr_Tags['start'] + ed.selection.getContent() + l_arr_Tags['end']; var returnText = tags.start + ed.selection.getContent() + tags.end;
ed.execCommand('insertHTML', true, return_text); ed.execCommand('insertHTML', true, returnText);
},
error: function (MLHttpRequest, textStatus, errorThrown) {
console.log('Error: ' + errorThrown);
}, },
error: function(MLHttpRequest, textStatus, errorThrown){
console.log("Error: " + errorThrown);
}
}); });
}); });
}, },
@ -50,7 +50,7 @@
* @param {tinymce.ControlManager} cm Control manager to use in order to create new control. * @param {tinymce.ControlManager} cm Control manager to use in order to create new control.
* @return {tinymce.ui.Control} New control instance or null if no control was created. * @return {tinymce.ui.Control} New control instance or null if no control was created.
*/ */
createControl : function(n, cm) { createControl: function (n, cm) {
return null; return null;
}, },

6740
package-lock.json generated Normal file

File diff suppressed because it is too large Load diff

23
package.json Normal file
View file

@ -0,0 +1,23 @@
{
"scripts": {
"format": "npm run format:js",
"format:fix": "npm run format:js:fix",
"format:js": "prettier --config .prettierrc './js/*.js'",
"format:js:fix": "npm run format:js -- --write",
"lint": "npm run lint:js && npm run lint:css",
"lint:fix": "npm run lint:js:fix && npm run lint:css:fix",
"lint:js": "eslint \"./js/*.js\"",
"lint:js:fix": "npm run lint:js -- --fix",
"lint:css": "stylelint \"./css/*.css\"",
"lint:css:fix": "npm run lint:css -- --fix"
},
"devDependencies": {
"eslint": "^7.24.0",
"eslint-config-prettier": "^8.2.0",
"eslint-config-wordpress": "^2.0.0",
"eslint-plugin-prettier": "^3.4.0",
"prettier": "^2.2.1",
"stylelint": "^13.12.0",
"stylelint-config-wordpress": "^17.0.0"
}
}