Skip to content

Silence some wrong unsafe-member-access errors #88

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Feb 25, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -102,6 +102,24 @@ module.exports = {
};
```

There are some limitations to these type-aware rules currently. Specifically, checks in the context of reactive assignments and store subscriptions will report false positives or false negatives, depending on the rule. In the case of reactive assignments, you can work around this by explicitly typing the reactive variable. An example with the `no-unsafe-member-access` rule:

```svelte
<script lang="ts">
import { writable } from 'svelte/store';

const store = writable([]);
$store.length; // incorrect no-unsafe-member-access error

$: assignment = [];
assignment.length; // incorrect no-unsafe-member-access error
// You can work around this by doing
let another_assignment: string[];
$: another_assignment = [];
another_assignment.length; // OK
</script>
```

## Interactions with other plugins

Care needs to be taken when using this plugin alongside others. Take a look at [this list of things you need to watch out for](OTHER_PLUGINS.md).
Expand Down
47 changes: 28 additions & 19 deletions src/preprocess.js
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,12 @@ export const preprocess = text => {
const block = new_block();
state.blocks.set(with_file_ending('instance'), block);

block.transformed_code = vars.filter(v => v.injected || v.module).map(v => `let ${v.name};`).join('');
if (ast.module && processor_options.typescript) {
block.transformed_code = vars.filter(v => v.injected).map(v => `let ${v.name};`).join('');
block.transformed_code += text.slice(ast.module.content.start, ast.module.content.end);
} else {
block.transformed_code = vars.filter(v => v.injected || v.module).map(v => `let ${v.name};`).join('');
}

get_translation(text, block, ast.instance.content);

Expand All @@ -123,7 +128,19 @@ export const preprocess = text => {
const block = new_block();
state.blocks.set(with_file_ending('template'), block);

block.transformed_code = vars.map(v => `let ${v.name};`).join('');
if (processor_options.typescript) {
block.transformed_code = '';
if (ast.module) {
block.transformed_code += text.slice(ast.module.content.start, ast.module.content.end);
}
if (ast.instance) {
block.transformed_code += '\n';
block.transformed_code += vars.filter(v => v.injected).map(v => `let ${v.name};`).join('');
block.transformed_code += text.slice(ast.instance.content.start, ast.instance.content.end);
}
} else {
block.transformed_code = vars.map(v => `let ${v.name};`).join('');
}

const nodes_with_contextual_scope = new WeakSet();
let in_quoted_attribute = false;
Expand Down Expand Up @@ -209,14 +226,10 @@ const ts_import_transformer = (context) => {
// 5. parse the source to get the AST
// 6. return AST of step 5, warnings and vars of step 2
function compile_code(text, compiler, processor_options) {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I refactored the code for readability, functionality stayed the same.

let ast;
let warnings;
let vars;

const ts = processor_options.typescript;
let mapper;
let ts_result;
if (ts) {
if (!ts) {
return compiler.compile(text, { generate: false, ...processor_options.compiler_options });
} else {
const diffs = [];
let accumulated_diff = 0;
const transpiled = text.replace(/<script(\s[^]*?)?>([^]*?)<\/script>/gi, (match, attributes = '', content) => {
Expand Down Expand Up @@ -245,7 +258,9 @@ function compile_code(text, compiler, processor_options) {
});
return `<script${attributes}>${output.outputText}</script>`;
});
mapper = new DocumentMapper(text, transpiled, diffs);
const mapper = new DocumentMapper(text, transpiled, diffs);

let ts_result;
try {
ts_result = compiler.compile(transpiled, { generate: false, ...processor_options.compiler_options });
} catch (err) {
Expand All @@ -263,16 +278,10 @@ function compile_code(text, compiler, processor_options) {
.replace(/[^\n][^\n][^\n][^\n]\n/g, '/**/\n')
}</script>`;
});
}

if (!ts) {
({ ast, warnings, vars } = compiler.compile(text, { generate: false, ...processor_options.compiler_options }));
} else {
// if we do a full recompile Svelte can fail due to the blank script tag not declaring anything
// so instead we just parse for the AST (which is likely faster, anyways)
ast = compiler.parse(text, { ...processor_options.compiler_options });
({ warnings, vars } = ts_result);
const ast = compiler.parse(text, { ...processor_options.compiler_options });
const{ warnings, vars } = ts_result;
return { ast, warnings, vars, mapper };
}

return { ast, warnings, vars, mapper };
}
17 changes: 17 additions & 0 deletions test/samples/typescript-unsafe-member-access/.eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
module.exports = {
parser: "@typescript-eslint/parser",
plugins: [
"@typescript-eslint",
],
parserOptions: {
project: ["./tsconfig.json"],
tsconfigRootDir: __dirname,
extraFileExtensions: [".svelte"],
},
settings: {
"svelte3/typescript": require("typescript"),
},
rules: {
"@typescript-eslint/no-unsafe-member-access": "error",
},
};
40 changes: 40 additions & 0 deletions test/samples/typescript-unsafe-member-access/Input.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
<script lang="ts" context="module">
const context_safe = [];
const context_unsafe: any = null;

console.log(context_safe.length);
console.log(context_unsafe.length);
</script>

<script lang="ts">
import { writable } from 'svelte/store';
import { external_safe, external_unsafe } from './external-file';
const instance_safe = [];
const instance_unsafe: any = null;
$: reactive_safe = instance_safe;
$: reactive_unsafe = instance_unsafe;
const writable_safe = writable([]);
const writable_unsafe = writable(null as any);

console.log(context_safe.length);
console.log(context_unsafe.length);
console.log(external_safe.length);
console.log(external_unsafe.length);
console.log(instance_safe.length);
console.log(instance_unsafe.length);
// console.log(reactive_safe.length); TODO, current limitation
console.log(reactive_unsafe.length);
// console.log($writable_safe.length); TODO, current limitation
console.log($writable_unsafe.length);
</script>

{context_safe.length}
{context_unsafe.length}
{external_safe.length}
{external_unsafe.length}
{instance_safe.length}
{instance_unsafe.length}
<!-- {reactive_safe.length} TODO, current limitation -->
{reactive_unsafe.length}
<!-- {$writable_safe.length} TODO, current limitation -->
{$writable_unsafe.length}
90 changes: 90 additions & 0 deletions test/samples/typescript-unsafe-member-access/expected.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
[
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 6,
"column": 14,
"endLine": 6,
"endColumn": 35
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 20,
"column": 14,
"endLine": 20,
"endColumn": 35
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 22,
"column": 14,
"endLine": 22,
"endColumn": 36
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 24,
"column": 14,
"endLine": 24,
"endColumn": 36
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 26,
"column": 14,
"endLine": 26,
"endColumn": 36
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 28,
"column": 14,
"endLine": 28,
"endColumn": 37
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 32,
"column": 2,
"endLine": 32,
"endColumn": 23
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 34,
"column": 2,
"endLine": 34,
"endColumn": 24
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 36,
"column": 2,
"endLine": 36,
"endColumn": 24
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 38,
"column": 2,
"endLine": 38,
"endColumn": 24
},
{
"ruleId": "@typescript-eslint/no-unsafe-member-access",
"severity": 2,
"line": 40,
"column": 2,
"endLine": 40,
"endColumn": 25
}
]
2 changes: 2 additions & 0 deletions test/samples/typescript-unsafe-member-access/external-file.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export const external_safe = ['hi'];
export const external_unsafe: any = null;
3 changes: 3 additions & 0 deletions test/samples/typescript-unsafe-member-access/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"include": ["**/*"]
}
16 changes: 8 additions & 8 deletions test/samples/typescript/expected.json
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,8 @@
"messageId": "suggestUnknown",
"fix": {
"range": [
29,
32
58,
61
],
"text": "unknown"
},
Expand All @@ -46,8 +46,8 @@
"messageId": "suggestNever",
"fix": {
"range": [
29,
32
58,
61
],
"text": "never"
},
Expand Down Expand Up @@ -82,8 +82,8 @@
"messageId": "suggestUnknown",
"fix": {
"range": [
50,
53
79,
82
],
"text": "unknown"
},
Expand All @@ -93,8 +93,8 @@
"messageId": "suggestNever",
"fix": {
"range": [
50,
53
79,
82
],
"text": "never"
},
Expand Down