Make User-Friendly Error Pages in Drupal 10 with Ignition
At Velir, we’re busy building websites on Drupal 9 and upgrading clients to it since it’s the latest version of Drupal’s content management system. But we also have an eye on the next version, Drupal 10, so we spent a little time recently giving it a test drive. We even created a Drupal 10 module while we were doing it, and we’re sharing it here!
Drupal released Drupal 10’s first alpha version a few days ago. One of the biggest changes in that release is the dependency on Symfony components moved from version 4 to version 5. This is a step forward in making Drupal 10 ship with Symfony 6 components later this summer.
This may not seem like a large change on the surface. But, getting Symfony dependencies updated to the latest version opens many avenues for feature development in Drupal 10. Not only do you benefit from bug fixes and features added in those releases, but you can also take advantage of packages available in the broader PHP ecosystem that require newer versions of Symfony. One such third-party package is Ignition, a customizable error handler page.
Ignition allows you to override and beautify error pages in your PHP applications. One great aspect of it is that you can also add user-friendly messages with these errors along with links to helpful pages or solutions. We thought this would be an interesting thing to try since you can’t currently use this package in Drupal 9.
Without a package like Ignition, any error page will likely look like the following:
Senior developers are familiar with error dumps like this, and we can usually figure them out quickly. However, junior developers or new developers on a project might have trouble figuring out why they get these errors or how to resolve them.
With the Ignition package, that same error page would look like this:
This is a much-improved visual display of the error. Each stack trace is clickable, showing exactly what code and what line was called in each step. It’s also less intimidating to an uninitiated developer than a huge wall of text.
Using Ignition allows you to take this a step further, too. Getting an error like this only tells you that something happened. But often you may not know what to do as a next step. You can address that by using Ignition to display helpful pointers to solutions or documentation links. Here is that same error again, only this time we added some links and text into our custom error type with Ignition:
The area in green displays an extended description along with links to documentation, answers, a runbook, and in a worst-case scenario, an area where the developer can submit a ticket if they can’t resolve the issue on their own. This is a great enhancement that can ease the development experience and improve efficiency in debugging issues.
Being able to use newer packages in the PHP ecosystem grown in the Symfony, Laravel, or other PHP communities is an exciting prospect for Drupal 10. We look forward to coming up with innovative solutions for projects, even if they’re turning boring dusty error pages into something with a little more jazz.
We created a module that integrates this in Drupal 10 as we experimented with the new version of Drupal. The integration is light but works, transforming errors from plain text to the useful images you see above. We’re excited to learn more about Drupal 10 as new versions emerge for us to test.
Want to learn more about some of the changes coming in Drupal 10, or need help upgrading your website to Drupal 9? Reach out to us.