Front End Projects - Random Quote Machine - Translation Bug

JavaScript
1

Hi, I made the random quote machine challenge, it’s pretty similar to the original one.

The issue I’m getting now is that when it gets translated by google the quote/author stop changing.

I’ve tried applying the class “notranslate” on each separately or together and it stops it from happening but that means the one with that class or both of them don’t get translated.

Any help, critique or word of advice is welcomed and appreciated.
Thank you in advance dear Stranger

Your code so far
This is the deployed site

This is the GitHub Repository

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36

Challenge: Front End Development Libraries Projects - Build a Random Quote Machine

Link to the challenge:

2

This appears to be a known problem with React (and other frameworks as well) when someone uses the Google translate extension. There might be a workaround solution in one of those links but I’ll leave that reading to you :slight_smile:

Issue 872770: Google Translate’s usage of for text replacement breaks React

Make React resilient to DOM mutations from Google Translate

1 Like
3

Thank you for the readings, it actually is a much bigger issue than I thought it was.
I made it resilient using “notranslate” class.

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.