Emit warnings for undefined controllers, actions and targets #413
Conversation
|
Good call! Been using stimulus for years and debugging typoed attributes is still a big time suck. |
|
Thank goodness. 👏 |
|
@marcoroth Trying to use this in anger right now, and I'm seeing that this is causing false warnings for undefined controllers when connecting actions on what appears elements that declare multiple controllers. Seems like when the first controller is detected, the actions on that element are all inspected, and if one of the actions refer to one of the other controllers mention on that element, then you get an error. Haven't fully traced it down yet. |
|
Here's a test case: <html>
<head>
<script type="module">
import { Application, Controller } from "https://ga.jspm.io/npm:@hotwired/stimulus@3.0.0-beta.2/dist/stimulus.js"
const application = Application.start()
application.register("first", class extends Controller {
hello() {
alert("hello!")
}
})
application.register("second", class extends Controller {
goodbye() {
alert("goodbye!")
}
})
</script>
</head>
<body>
<div data-controller="first second" data-action="click->first#hello click->second#goodbye">
</div>
</body>
</html>Produces: |
|
@dhh I also get this same behaviour with "nested" controllers - if I remove the top controller I get no warnings (so I know it isn't a typo etc). But when there is a top "outer" controller then the actions on the inner controller trigger warnings. I am assuming they are being parsed when stimulus is initialising the first outer controller. |
|
Warnings have been removed from the 3.0 release. They need more time in the oven. |
This PR allows Stimulus to emit warnings if a controller, action or target name is misspelled, incorrect or non-existent.
Previously Stimulus just ignored the wrong declared objects and just did nothing which makes it especially hard for newcomers to grok what's going on. This PR helps in that matter because it emits warnings upfront.
The following scenarios are covered and emit a warning if:
data-controllerattribute doesn't exist or isn't registered in the Applicationdata-actionattribute doesn't exist on the given controllerdata-actionattribute doesn't existdata-targetordata-[identifier]-targetdoesn't exist in thestatic targetsarray of the controller.data-targetdoesn't existdata-[identifier]-targetattribute is emptydata-targetattribute is wrong or if the value is emptyYou can also silence the warnings by setting
warningstofalse:const application = Application.start() const context = require.context("./controllers", true, /\.js$/) application.load(definitionsFromContext(context)) + application.warnings = falseResolves #324