DEV Community

Leejjon
Leejjon

Posted on

2 6

Did your end users ever noticed missing translations on the production version of your app? Here's how I prevent this.

Forgetting to add translations are stupid things that happen. If you test manually, it's easy to miss them because you probably won't test all functionality in every language you support.

It can result in embarrassing complaints from end users like below:
Missing translation in Dutch version of blindpool.com

Here's an example of how you can write a simple test in TypeScript to verify that every key that I added to the English message bundle has also been added to the Dutch one.

describe('Test', () => {
    const englishMessageBundle = {
        "KEY1": "VALUE1",
        "KEY2": "VALUE2",
        "KEY3": "VALUE3",
    };

    const dutchMessageBundle = {
        "KEY1": "WAARDE1",
        // We forgot to add KEY 2, the test should notice this and fail.
        "KEY3": "WAARDE3",
    };

    test('Verify if all keys in the english bundle also exist in the dutch bundle', () => {
        for (const [key] of Object.entries(englishMessageBundle)) {
            expect(Object.prototype.hasOwnProperty.call(dutchMessageBundle, key)).toBeTruthy();
        }
    });
});

Here's how it looks running from my IDE (IntelliJ):
Test that verifies that the dutch bundle has defined all keys that are in the English translation file

If you do CI/CD and have a build server that runs all tests after every commit, you should notice missing translations before deploying to production.

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Postgres on Neon - Get the Free Plan

No credit card required. The database you love, on a serverless platform designed to help you build faster.

Get Postgres on Neon