Code Transformation and Linting with ASTs

Challenge 2: Adding New Methods

Kent C. Dodds

Kent C. Dodds

Professional Trainer
Code Transformation and Linting with ASTs

Check out a free preview of the full Code Transformation and Linting with ASTs course

The "Challenge 2: Adding New Methods" Lesson is part of the full, Code Transformation and Linting with ASTs course featured in this preview video. Here's what you'd learn in this lesson:

In this challenge, students write a plugin that integrates new methods and functions that past validation.


Transcript from the "Challenge 2: Adding New Methods" Lesson

>> Kent C Dodds: Yeah, so you're gonna run the exercise script again to get to our next exercise. So this, if you did a really complicated plugin that you were really proud of or something, then you're gonna want to copy this. Because when you run the exercise script, it's gonna totally delete all the work that you had.

This way, we're all on the same page for every exercise, so nobody falls behind, and that kinda thing. But if you're really proud of your work here, then copy it. You can save it somewhere else and show it to your family or something. [LAUGH] Okay, so we're gonna do npm start exercise.eslint.1.

>> Kent C Dodds: And now your exercise should look like mine, and your test should be failing. So we have more tests, more use cases we didn't consider before.
>> Kent C Dodds: Fun fact on this npm start, you can actually use prefixes. So if you don't wanna type out exercise, you can do ex and then es.

And that still works, so that's kinda fun.
>> Kent C Dodds: Okay, cool, so let's see these new use cases that we need to support.
>> Kent C Dodds: Whoops, yeah. So now we need to make sure that if I use foo.console, that should still work. Maybe I have a method called console, or even a property on an object or something.

If I just call a console function, that should still work. What if I have a function that accepts a console function, or something like that? Or this is the one that'll be a little bit more tricky is, if I'm calling a function on console that is not one of some disallowed functions, then that should be fine.

Which it's a little bit contrived because I wouldn't want people calling console.baz. That doesn't make sense. But my goal here is to show you how to scope down what you're looking for further. As far as anything else that you need to know, I'll just give you a little tip.

>> Kent C Dodds: What I do in my solution is, at the very top, I create this variable called disallowedMethods. And I put all the console methods in here, so log, and warn, and all the ones I wanna prevent against. And then I use that with array includes, to determine whether or not the thing that is being called is included in that, those design methods.

So fun little tip.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now