Warn if PropType function is called manually

[aweary]

Resolves #7131

@gaearon so I added a new file ReactPropTypesSecret that is used internally to verify that a propType function is not being called manually. For the tests I basically reused what you had in #6401 as far as structure goes. Everything should be passing.

I wasn't sure if we wanted to dedupe this errors. If so I'm thinking we'd have to track it by componentName or something. Let me know what you think.

[gaearon]

Let’s also check if (typeof console !== 'undefined')

[gaearon]

Let’s make an if branch and do different assertions in if and else. This would read simpler IMO.

[aweary]

Well if we're not doing any __DEV__ tests then it would just be a constant 0 right? No need for any kind of branching.

[gaearon]

Nit: .toString().

[aweary]

👍 will do. Just curious, why? It'll be coerced to a string either way AFAIK.

[gaearon]

My concern was that if we only warned once and they are calling PropType functions in multiple places they are only being warned about one of those instances. That might be annoying, especially in production, since you'd think you fixed it (since you only got one warning) and then you'd get the warning again for the next instance.

Now that I think of it, why not warn in development instead? It would be much easier to catch that issue even if the warning is only printed once.

Sorry about the churn 😄

So we could do the following:

• Warn once on any manual call in development
• Don’t do anything in production

Do you think this makes more sense?

We’d still change production behavior eventually, but at least people would become aware during development that calling them manually is not OK—whether in development or in production.

[aweary]

Now that I think of it, why not warn in development instead? It would be much easier to catch that issue even if the warning is only printed once.

I agree, production-only errors might be frustrating since some users might not catch those until it's deployed to a staging environment (or even to actual production).

Sorry about the churn 😄

No worries at all! I'd rather get it done right than get it done quick 😄

So we could do the following:

• Warn once on any manual call in development
• Don’t do anything in production

That seems sensible and consistent with other warnings/errors in React. Since we'd be doing these warnings in development, I think it would make the most sense to warn once for every instance where they're calling PropTypes function manually. Since dev warnings aren't really expensive, I feel like that would be the most useful.

All we'd need to do is create a cache in the createChainableTypeChecker closure that stores the component and prop name (like { component { prop } }) and check against that.

Does that sound good @gaearon?

[gaearon]

I think it would make the most sense to warn once for every instance where they're calling PropTypes function manually.

I’m hesitant because I can’t imagine somebody calling them as one-offs. If somebody actually calls those functions manually, I imagine they might be a part of something like a form validator, in which case you’d see a warning on every keystroke.

Do you see deduping based on componentName:propName a good compromise?

[aweary]

Do you see deduping based on componentName:propName a good compromise?

That's actually what I was trying to recommend. Checking if a warning has been logged for ${component}:${prop} so that it's not logged multiple times if props are checked again, but it still logs once for every instance where they are manually calling the PropType function.

By "instance" I meant every place where they're manually calling a PropType function, not every time the function is invoked. Sorry, my terminology was probably a little confusing.

[gaearon]

Well, technically, you can’t really know where it’s being called from. You only know what arguments are being passed. But seems like we agree on the proposal.

[aweary]

Well, technically, you can’t really know where it’s being called from. You only know what arguments are being passed.

Right, I don't mean to imply that the location in the code path is being considered at all. I mean that we cache it so that for each PropTypes function we only log out a warning once for any combination of componentName or propName, regardless of how many times it might be invoked with those arguments.

But seems like we agree on the proposal.
👍

[aweary]

@gaearon I'd be happy to! I'll get a PR going right now

[jedwards1211]

@spicyj but there were plenty of other great possibilities! like SECRET_DO_NOT_PASS_THIS_EXPLICITLY_OR_YOU_WILL_BE_DEFENESTRATED. I always wish there were more opportunities for jokes embedded in code.