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

Function name shortened, but not function call #25

Open
MorganLee909 opened this issue Jul 31, 2020 · 9 comments
Open

Function name shortened, but not function call #25

MorganLee909 opened this issue Jul 31, 2020 · 9 comments
Labels

Comments

@MorganLee909
Copy link

MorganLee909 commented Jul 31, 2020

There seems to be a problem with shortening names in some cases. Below is an example.

{
    addOnclick: function(){
        element.onclick = ()=>{this.foo("some string")};
    },

    foo: function(str){
        //do things
    }
}

I get: "this.foo is not a function"
What it looks like is happening is that it is changing the name of the function, but it is not changing the call to that function. It seems to do this everywhere that I have this format as far as I can tell. It works with browserify of course, but it breaks with tinyify.

@MorganLee909 MorganLee909 changed the title Tinyify breaks working code Function name shortened, but not function call Jul 31, 2020
@goto-bus-stop
Copy link
Member

There are some syntax errors in that snippet so I'm not sure if I'm reproducing it correctly. Name changes are done by terser, so you could try putting the actual code into https://try.terser.org/ and seeing if the same issue occurs.

@MorganLee909
Copy link
Author

MorganLee909 commented Jul 31, 2020

Sorry for the terrible code. I fixed it up so that it should be good now. I tried it in Terser and it seems to do it correctly and looks fine to me.

@MorganLee909
Copy link
Author

I double checked with my own code, and as far as I can tell, it is working in Terser.

@goto-bus-stop
Copy link
Member

tinyify was depending on an older version of terser. I just published tinyify@3.0.0, could you try again with that?

@MorganLee909
Copy link
Author

MorganLee909 commented Jul 31, 2020

Updated it to 3.0.0 but I am still having the same problem. Also, I checked with addEventListener and the same problem still occurs.

@goto-bus-stop
Copy link
Member

Hmm it might be a bit more complicated then 😞 I tried just bundling this with browserify + tinyify and it seemed OK:

window.x={
    addOnclick: function(){
        element.onclick = ()=>{this.foo("some string")};
    },

    foo: function(str){
        //do things
    }
}

so perhaps it needs a few more moving parts to show the issue. Could you share code that fully reproduces the problem? Something I can pass straight through browserify -p tinyify to see the issue? 🙂

@MorganLee909
Copy link
Author

Alright, so this one took me a while. Most things that I tried to do worked just fine. I created a repo with a very simple example of the problem. Note that I had to import from a module. If I did it in a single file, then it worked just fine.
https://github.com/MorganLee909/test-tinyify

@goto-bus-stop
Copy link
Member

goto-bus-stop commented Aug 2, 2020

Awesome, thanks. It looks like common-shakeify does not count the this.bar() call as a use of the exported bar function, and decides to remove it because it appears unused.

You can work around it until it's fixed by doing something like

var x = {
  foo: function() { /* snip */ },
  bar: function() { /* snip */ }
};
module.exports = x;

Then common-shakeify will not see the foo and bar properties as individual exports, and it will not shake the bar function out.

@MorganLee909
Copy link
Author

Awesome, thanks a lot, that's a pretty damn simple workaround. I appreciate the help a lot.

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

No branches or pull requests

2 participants