this.backend undefined during SaveMissing call

[lachauj]

I am trying to make it work saveMissing.
I added some debug in i18next.js and when saveMissing is called, this.backend is undefined so nothing is sent to i18next-fs-backend.

if (this.backend && this.backend.create) { this.backend.create(languages, namespace, key, fallbackValue, null, _objectSpread$5(_objectSpread$5({}, options), {}, { isUpdate: isUpdate })); }

I noticed that the saveMissing() call is client side and seems to be a problem, should be called on server side right ?

Everything else works perfectly, the existing keys are translated.

[adrai]

saveMissing only works if a backend is configured...
for example here it is: https://locize.com/blog/next-i18next/#save-missing (and also only on client side)

[lachauj]

Oh but what about the built-in backend i18next-fs-backend ? It will never write any missing keys in the "addPath" ?

[adrai]

just tested, seems to work:

[lachauj]

Can you provide me your boilerplate please ? I've been working on it for 3 days...

[adrai]

https://github.com/i18next/next-i18next/tree/master/examples/simple

[lachauj]

Thank you, I finally found the issue. In the _app.tsx I had two return.

Return an empty div for a sec was the issue

Edit: Seems to be an issue for my whole app, missingKeys are detected only on the first return in the component.

[lachauj]

In this case loading is not a state, therefore it will never trigger a re-render on the server side.
So only 'first missing' is detected as a missing key, how can I trigger the detection of the 'second missing' ?

[adrai]

I suggest to use saveMissing only on client side