lingui / lingui/js-lingui

Event ID is `undefined` in `missing` trigger

Open
#2,197 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
TypeScript
Stars
5.9k
Forks
457
Avg merge
1d 23h
Merged PRs (30d)
16

Description

### Description

The event ID is always being passed properly to the `missing` trigger. In our error logging we are finding that the ID property is missing, suggesting that it is `undefined` when the `missing` trigger is activated. I could not find any issues describing this nor any part of the [documentation](https://github.com/lingui/js-lingui/blob/main/website/docs/ref/core.md#missing) that explains how this could happen or what to do when it does

### Verifications

- [x] I've checked [the docs](https://lingui.dev) and this isn't covered there.
- [x] I've searched existing issues on [GitHub](https://github.com/lingui/js-lingui/issues).

### Reproduction Steps

```tsx
import { I18nProvider } from '@lingui/react';
import { i18n, Locale } from '@lingui/core';

type MissingMessageEvent = {
locale: Locale;
id: string;
};

function onMissingTranslation(event: MissingMessageEvent) {
// Note: id is undefined here so it is not being picked up in the console, as stringify drops undefined values
console.error(`Missing translation for string: ${JSON.stringify(event)}`)
}

export default function App({
children
}: {
children: React.ReactNode;
}) {
const locale = "en-US"; // example
const messages = loadMessages(...); // queried using a suspense query

const activatedI18n = useMemo(() => {
i18n.load(locale, messages);
i18n.activate(locale);
i18n.on('missing', onMissingTranslation);
return i18n;
}, [locale, messages]);

return {children};
}
```

### Expected Behavior

I would expect that `id` is a present field in our console errors.

### Macro Support

SWC with @lingui/swc-plugin

### Lingui Version

5.0.0-next.0

### Babel Version

_No response_

### Framework

Next.js

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the `missing` trigger documentation in the linked core reference and the provided Next.js reproduction. Trace how the event is emitted and compare the observed payload with the expected `id` field. Done means the cause and expected behavior are verified, with the resolution reflected in coverage or documentation.

Written by the indexing model from the issue text.

Assessment

Tech stack
next.js, react, typescript
Domain
internationalization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.