Skip to content
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

[JavaScript] Syntax highlighting issue with object methods #403

Closed
amalk opened this issue May 16, 2016 · 10 comments
Closed

[JavaScript] Syntax highlighting issue with object methods #403

amalk opened this issue May 16, 2016 · 10 comments

Comments

@amalk
Copy link

amalk commented May 16, 2016

Stable Build 3114

Same method body loses highlighting when nested too deep.

1
2

@FichteFoll
Copy link
Collaborator

Please also provide the code snippets for easier reproduction (though copy'n'paste).

@amalk
Copy link
Author

amalk commented May 17, 2016

Right. The last level in this code loses the highlighting:

    function foo() {
        TweenLite.to(el, 1, {
            onComplete: function() {
                TweenLite.to(el, 1, {
                    onComplete: function() {
                        TweenLite.to(el, 1, {
                            onComplete: function() {
                                TweenLite.to(el, 1, {
                                    onComplete: function() {
                                        TweenLite.to(el, 1, {
                                            onComplete: function() {

                                            }
                                        });
                                    }
                                });
                            }
                        });
                    }
                });
            }
        });
    }

@FichteFoll
Copy link
Collaborator

FichteFoll commented May 17, 2016

I only start losing highlighting with this:

function foo() {
    TweenLite.to(el, 1, {
        onComplete: function() {
            TweenLite.to(el, 1, {
                onComplete: function() {
                    TweenLite.to(el, 1, {
                        onComplete: function() {
                            TweenLite.to(el, 1, {
                                onComplete: function() {
                                    TweenLite.to(el, 1, {
                                        onComplete: function() {
                                            TweenLite.to(el, 1, {
                                                onComplete: function() {
                                                    TweenLite.to(el, 1, {
                                                        onComplete: function() {
                                                            TweenLite.to(el, 1, {
                                                                onComplete: function() {
                                                                    TweenLite.to(el, 1, {
                                                                        onComplete: function() {
                                                                            TweenLite.to(el, 1, {
                                                                                onComplete: function() {
                                                                                    TweenLite.to(el, 1, {
                                                                                        onComplete: function() {
                                                                                            TweenLite.to(el, 1, {
                                                                                                onComplete: function() {
                                                                                                 TweenLite.to(el, 1, {
                                                                                                     onComplete: function() {
                                                                                                      TweenLite.to(el, 1, {
                                                                                                          onComplete: function() {
                                                                                                           TweenLite.to(el, 1, {
                                                                                                               onComplete: function() {

                                                                                                               }
                                                                                                           });     
                                                                                                          }
                                                                                                      });     
                                                                                                     }
                                                                                                 });     
                                                                                                }
                                                                                            });  
                                                                                        }
                                                                                    });  
                                                                                }
                                                                            });  
                                                                        }
                                                                    });  
                                                                }
                                                            });
                                                        }
                                                    });
                                                }
                                            });
                                        }
                                    });
                                }
                            });
                        }
                    });
                }
            });
        }
    });
}

which is a side effect of the scope name becoming to long. In the empty line, the exact scope name would be:

source.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.block.js

which is really long and code probably shouldn't be nested that deeply, which is why ST probably assumes that any scope beyond a specific length is the result of an errorneous syntax definition and stops highlighting in order not to freeze up entirely.

As a side bug report, this shouldn't be a meta.object-literal to begin with since it's a function definition (cc @wbond).

@keith-hall
Copy link
Collaborator

Interestingly, I lose highlighting and then seem to re-gain it.

js highlighting nesting

Notice how the 1 on the inner most TweenLite.to( line is not highlighted, but the onComplete: function() { on the line afterwards is, despite being nested one level deeper by the {.

The 1 has the correct ending scope of constant.numeric.js

@FichteFoll
Copy link
Collaborator

Confirmed:

2016-05-17_13 26 23

@wbond
Copy link
Member

wbond commented May 19, 2016

@FichteFoll I don't see where it is beginning with object-literal. It seems properly nested inside of meta.block, meta.function-call and meta.group.

@FichteFoll
Copy link
Collaborator

FichteFoll commented May 19, 2016

@wbond, yes you're right, the meta.object-literal scope is correct.

So I guess the only problem here is that the number 1 in line 10 does not receive the correct highlighting despite having the correct scope name?

@wbond
Copy link
Member

wbond commented May 19, 2016

Using the scope inspector, all of the scopes seem correct. The strange thing is that the 1 is colored properly with some color schemes.

I'm looking into the core code base to see what is the cause of the weirdness.

This should probably be moved over to the core issue tracker.

@wbond
Copy link
Member

wbond commented May 24, 2016

This will be fixed in dev build 3115. It was a bug in Sublime Text proper, and not the syntax.

@FichteFoll
Copy link
Collaborator

FichteFoll commented Jun 22, 2016

Confirmed fixed in 3116, by the way.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants