Only the id="0" Variant component is rendered.

[casamia918]

I've installed this library and used exactly as same as example code.

My app is rendering A/B test properly, as my Google optimize experiment setup.

But, when I insert simple test code like above image to check which variant component is rendered, it always rendering variant with id="0".

I think only the id="0" Variant component is rendered. But I can't understand why this happens.

I read the component source code, but it looks have no problem.

[hudovisk]

Hey @casamia918,

Its been some time since I last used this library, but can you share more how you are testing the snippet of code? I remember that in order to run it locally you cannot use localhost for the domain, something related with the cookies used by google optimize. Maybe this stack overflow answer can help you: https://stackoverflow.com/a/56635677/13470154

[casamia918]

@hudovisk

I'm not using localhost in my domain name, but using ip address.

I've inserted google optimize snippet code at top of the index.html file, as same as the official optimize doc says.

My a/b test is working. But in your library code, only the Variant id="0" component is rendered.

At last, I've removed your library code and just inserted only the google optimize snippet code, but the a/b test is still working properly.

Now, my new question is, why should I use this library to apply google optimize? I'm confused.

[hudovisk]

I'm not using localhost in my domain name, but using ip address.

I see, but I would still recommend to use a custom domain name when testing. You could modify your /etc/hosts file and map localhost or the ip address you use to a domain name like my.app.localhost (that was what worked for me). From my experience, when you test a variant from the google optimize dashboard it opens your custom domain in a new tab with a cookie that defines the variant, and according to the specs the domain name should have 2 dots (https://stackoverflow.com/a/1188145)

Now, my new question is, why should I use this library to apply google optimize? I'm confused.

You definitely don't need this library to use google optimize, I created it because I had a use case where I needed custom react components to show according the google optimize experiment and I couldn't get it without using the js api of google optimize. This library just abstract that away.

[casamia918]

Oh, I see. Thanks

[benmercerdev]

I ran into this same issue when I was previewing on Google Optimize -- it would only show Variant 0

After I ran the "debug" preview page there was URL match error as I the page targeting I had specified didn't match my dev url.

Removing the page targeting rule on Google Optimize allowed me to view all the variants.

I added this back before starting the experiment.