False positive for restrict-plus-operands rule - num + "string".length

[ChrisMBarr]

Bug Report

• TSLint version: 4.5.1
• TypeScript version: 2.2.2
• Running TSLint via: gulp-tslint

TypeScript code being linted

const startPos= 5;
const txt= "foo";
const newPos = startPos + txt.length; //Error reported here

with tslint.json configuration:

"restrict-plus-operands": true

Actual behavior

Reports Operands of '+' operation must either be both strings or both numbers

Expected behavior

Should not report an error since a number and the length of a string (which is a number) are being added together.

[andy-hanson]

I can't reproduce this. I'm using the exact tslint/typescript versions you posted and the exact text you provided. I'm using the command line instead of gulp-tslint though.

[ChrisMBarr]

Sorry, I didn't provide a very good sample before! It was a simplified version that I didn't test. Below is the actual code block where I saw the error reported.

namespace App.Widgets.Components {

    let startPos = getCaretStartPosition(textarea);
    let endPos = getCaretEndPosition(textarea);
    const front = (textarea.value).substring(0, startPos);
    const back = (textarea.value).substring(endPos, textarea.value.length);
    let markdown = getMarkdownToInsert(startPos, endPos, front);
    const newPosition = startPos + markdown.length;  //<-- Violation reported here
    setCaretPosition(textarea, newPosition);

}

And then in another "helper" file in the same namespace we have those functions that are being called:

namespace App.Widgets.Components {

    export const getTextareaElement = (selector: string): HTMLTextAreaElement => {
        if (!selector) {
            throw Error("The selector has not been provided for 'ln-textarea-selector', please provide a selector!");
        }
        const selectedElement = angular.element(selector);
        if (selectedElement.length === 0) {
            throw Error(`An element was not found using the selector '${selector}'`);
        } else if (!selectedElement.is("textarea")) {
            throw Error("The element must be of type textarea");
        }
        return <HTMLTextAreaElement>selectedElement[0];
    };

    export const getCaretStartPosition = (element: HTMLTextAreaElement): number => {
        if (element.selectionStart || element.selectionStart === 0) {
            return element.selectionStart;
        } else {
            return 0;
        }
    };

    export const getCaretEndPosition = (element: HTMLTextAreaElement): number => {
        if (element.selectionEnd || element.selectionEnd === 0) {
            return element.selectionEnd;
        } else {
            return 0;
        }
    };

    export const setCaretPosition = (element: HTMLTextAreaElement, position: number): void => {
        element.focus();
        element.setSelectionRange(position, position);
    };

}

The issue seems to be that it cannot determine the return type of thegetCaretStartPosition function, perhaps due to it being in another file? When I change it to have an explicit typedef like let startPos: number = getCaretStartPosition(textarea); then it no longer reports a violation. This works for now, but I shouldn't have to do this since TypeScript knows that the getCaretStartPosition returns a value of type number

[andy-hanson]

That example isn't reproducable because I don't have getMarkdownToInsert. Using that code with let markdown = "123"; results in no error. Can you find a repro that works on its own?

[SteeluserTeam]

I have the same kind of errors if I add "no-unused-variable" rule to my tslint.json file. If I remove the "no-unused-variable" rule, the "restrict-plus-operands" rule is not complaining anymore.

[sssalib42]

If someone needs it...
I used:

if (!!couldBeUndefinedNumber) {
const numVar: number = couldBeUndefinedNumber;
// use numVar safely :)
}

[maxime1992]

Anything solved regarding that? I've got this error with 2 numbers...