diff --git a/eslint-rules/README.md b/eslint-rules/README.md index 7c882dd..5254b9e 100644 --- a/eslint-rules/README.md +++ b/eslint-rules/README.md @@ -2,6 +2,50 @@ This directory contains custom ESLint rules for the project. +## no-inline-script + +This rule prevents the use of inline script tags in HTML files. Inline scripts can pose security risks and violate Content Security Policy (CSP) directives. + +### Examples + +❌ **Bad** - These will trigger the rule: +```html + + + + + +``` + +✅ **Good** - These are fine: +```html + + + + + + +``` + +### Configuration + +The rule is configured in `eslint.config.js` as: +```javascript +"custom/no-inline-script": "error" +``` + +### Purpose + +This rule helps maintain security best practices by: +- Preventing XSS vulnerabilities from inline scripts +- Enforcing Content Security Policy compliance +- Encouraging separation of concerns (HTML structure vs JavaScript logic) +- Making code easier to maintain and debug + ## no-placeholder-comments This rule detects and flags comments that start with "// In a real" (case-insensitive). These comments typically indicate placeholder implementations that should be replaced with real code. @@ -46,4 +90,57 @@ You can change the severity level to: ### Purpose -This rule helps ensure that placeholder comments used during development are replaced with actual implementations before code is committed or deployed to production. \ No newline at end of file +This rule helps ensure that placeholder comments used during development are replaced with actual implementations before code is committed or deployed to production. + +## require-webmanifest + +This rule ensures that HTML files include a proper web manifest link tag and that the referenced manifest file exists. Web manifests are essential for Progressive Web Apps (PWAs) and provide metadata about the application. + +### Examples + +❌ **Bad** - These will trigger the rule: +```html + + + My App + + + + + + + + + + + +``` + +✅ **Good** - These are fine: +```html + + + + + + + + + +``` + +### Configuration + +The rule is configured in `eslint.config.js` as: +```javascript +"custom/require-webmanifest": "error" +``` + +### Purpose + +This rule helps ensure: +- PWA compliance by requiring a web manifest +- Proper manifest file structure and accessibility +- Better user experience on mobile devices +- App installation capabilities +- Consistent branding and metadata across platforms \ No newline at end of file diff --git a/eslint-rules/index.js b/eslint-rules/index.js index d534be1..bbaeecd 100644 --- a/eslint-rules/index.js +++ b/eslint-rules/index.js @@ -1,8 +1,10 @@ +import noInlineScript from './no-inline-script.js'; import noPlaceholderComments from './no-placeholder-comments.js'; import requireWebmanifest from './require-webmanifest.js'; export default { rules: { + 'no-inline-script': noInlineScript, 'no-placeholder-comments': noPlaceholderComments, 'require-webmanifest': requireWebmanifest, }, diff --git a/eslint-rules/no-inline-script.js b/eslint-rules/no-inline-script.js new file mode 100644 index 0000000..8227257 --- /dev/null +++ b/eslint-rules/no-inline-script.js @@ -0,0 +1,40 @@ +/** + * Rule to prevent inline script tags in HTML files + */ + +export default { + meta: { + type: 'problem', + docs: { + description: 'Prevent inline script tags in HTML files', + category: 'Security', + recommended: true, + }, + fixable: null, + schema: [], + messages: { + noInlineScript: 'Inline script tags are not allowed. Move script content to external files.', + }, + }, + + create(context) { + return { + // For HTML files, we need to check script tags + 'ScriptTag'(node) { + // Check if this is an inline script (has content but no src attribute) + const hasContent = node.value && node.value.value && node.value.value.trim().length > 0; + const hasSrc = node.attributes && node.attributes.some(attr => + attr.key && attr.key.value === 'src' + ); + + // If the script has content but no src attribute, it's an inline script + if (hasContent && !hasSrc) { + context.report({ + node, + messageId: 'noInlineScript', + }); + } + }, + }; + }, +}; \ No newline at end of file diff --git a/eslint.config.js b/eslint.config.js index 2caeb10..e94aa16 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -68,6 +68,7 @@ export default tseslint.config( "og:description", ], ], + "custom/no-inline-script": "error", "custom/require-webmanifest": "error", }, }