This is my solution to this challenge. It was build using Sass, specifically SCSS syntax and Vanilla JavaScript.
The only problem I'm encountering is that the advice that is displayed isn't refreshed on Firefox when the dice button is clicked and it even persists when the page is reloaded. I'm aware of the API's rate limiting and I'm sure that is not the problem since it works just fine on Chrome.
If anyone knows the solution to the problem I'm facing or other, general, suggestions please feel free to leave your feedback. Thanks! :)
@KorniDoS
Posted
Hi! You did a great job working with async and await! I've faced the same issue recently with Firefox but not Chrome. The solution to this is including the cache:"no-store" property after the fetch URL: fetch('https://api.adviceslip.com/advice', {cache: "no-store"}).
Marked as helpful
@zubyCharles
Posted
I ran into the exact same problem when I did the challenge. Firefox kept returning the same advice object, worked well on chrome though. When I selected no-caching on my firefox browser settings it began working fine. So it’s a caching issue. I can see you’ve received help on how to solve this programmatically.
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord
