How to query?February 19, 2020 at 11:41am
General title but not sure how do make it better without making it a mile long.
To explain where this comes from: Me and several other developers are doing a web app to track dice results in a game. For now it's going to be in our native language of Swedish but we want to be able present it in English as well. All the test have so far been written with
getByTextquery which works fine, but one from my team brought up the issue of when it is multi language how should be handle these test then since it won't be a set text to search for. It might for example be
Or in another case a developer might decide the button should have a different text all together, of course then the text will fail.
I'm thinking isn't that the point? That it should fail, to avoid making mistakes and if the text should change the tests will have to be updated I suppose.
That doesn't all hold up in the case of different languages thought and I am unsure how to handle that one. I have been looking at TextMatch but it won't accent a regexp like this
/(^Starta Spel$)\b)|(^Start Game$)/ior this
/(\b(\w*Starta Spel\w*)\b)|(\b(\w*Start Game\w*)\b)/
I read about the proposed recommended order to do query by some kind of text that can be found in the DOM firstly or resort to
Any recommendations or thought on this.
February 19, 2020 at 11:51am
Hi again :)
I never had to test something like this before, but I think in the same way you translate the text of the component you should translate the text you are looking for in the test, something like
getByText(t('Start Game')). This implies wrapping all your tests with your i18n mechanism enabled, which I'd say it's fine. You can even customize the render so it's always wrapped with it. Could be even interesting to run your tests in 2 different pipelines: one in English and one in Swedish so you know expected translated texts are there.
But as I said this is in theory. I don't know if applying ths can have any issue I can't think of at the moment.