#no-invalid-file-input-accept

#Configuration

import { defineConfig, unicornPlugin } from '@rslint/core';

export default defineConfig([
  unicornPlugin.configs.recommended,
  {
    rules: {
      'unicorn/no-invalid-file-input-accept': 'error',
    },
  },
]);

#Rule Details

An explicit accept attribute on a JSX file input must be a static, comma-separated list of filename extensions, MIME types, or the wildcards audio/*, image/*, and video/*.

The rule reports empty entries and invalid values. It can fix casing, spacing, duplicate entries, missing extension dots, and common MIME type mistakes in quoted attributes. An expression such as accept={"IMAGE/PNG"} also gets a diagnostic when it needs normalization. Edit the expression to use the value named in the diagnostic.

Examples of incorrect code for this rule

<input type="file" accept="image/jpg" />;
<input type="file" accept="png" />;
<input type="file" accept="IMAGE/*" />;
<input type="file" accept="IMAGE/PNG,.PNG, image/png" />;
<input type="file" accept={allowedTypes} />;

Examples of correct code for this rule

<input type="file" accept="image/jpeg" />;
<input type="file" accept=".png" />;
<input type="file" accept="image/*" />;
<input type="file" accept="image/png, .png" />;

#Options

This rule has no options.

#Differences from upstream

Rslint checks JSX in JavaScript and TypeScript files. Use ESLint Unicorn with html-eslint to check standalone HTML files.

Autofixes preserve character references where needed. For example, accept=""PNG" becomes accept="."png".

The rule checks the characters that numeric references represent. It skips an input with type="f𐁩le" and reports .😀png for accept="😀PNG". Edit the latter manually to preserve the emoji. Normalizing accept="�PNG" also requires a manual edit because the value contains an unpaired surrogate.

#Original Documentation

• eslint-plugin-unicorn: no-invalid-file-input-accept
• Source code