Not rendering correctly with multiple instances

[simonv4549]

I came across an issue where on mobile the button text would wrap, I thought it may have been something that I had done by mistake while I was customizing so I thought I would revert everything back to your code from the demo page. But the issue still exists, and the strange thing is if I add a 2nd instance of your code the 1st instance then works perfect. If I add 3 or 4 instances the first X works fine only the final instance is wrapping the text?

I have created a demo page here on my site so you can see what I mean, If you view this on mobile (iphone5 I was using) or even in Chrome with mobile emulation you will see the issue?
http://www.certforums.com/pages/rrssb/

Could you help with a fix?

[simonv4549]

Does anyone still maintain this script? I found the text wrapping issue as it was a CSS conflict with word-wrap used in the template.

But I still have the issue where if more than one instance is shown the last instance does not render the same as the other instance. Does anyone else have this issue? At certain screen widths the last instance the buttons change size at different intervals.

[dbox]

I looked at your page. Seems to be all good?

[simonv4549]

This is still an issue, Please can you look into it further.

If you view the page http://www.certforums.com/pages/rrssb/ at certain resolutions you will see the issue I have added 3 instances so you can see its always the final instance that it happens.

Use google chrome with mobile inspector and use Google Nexus 4 as the device and you will see the issue.

[dbox]

@simonv4549 i can't replicate it on the example you provided

[simonv4549]

Well Im at a loss has to how you cant see this and I have multiple confirmations from others that it happens. I happens even within the browser when resized and I checked with the latest version of FF and Chrome on Mac and IE11 and FF on Windows and I can see it by resizing the window to a narrow viewpoint. Plus using the Chrome Mobile Emulation everyone I have asked to test it can see it happening. I also have somebody viewing from a LG 4 phone who first pointed this out to me that 100% can see this issue.

I really dont know what more I can do to try to explain it to you, do you have any ideas?

[tmaiaroto]

I see the same thing. The first share button, regardless of which one it is, does not size properly. It includes the text when it shouldn't. Doesn't matter which browser in my testing, I'm looking at it on Chrome on a desktop (with a container that's forcing the sizes smaller).

...You can hack around it by including another <li> item and setting a style="display:none;" attribute on the element so it hides. Hacky, but works. Maybe there's something in a loop somewhere with a counter that's off. I don't have the time to look at the moment, but will try later.

In fact, you don't even need all the guts. Just do <li style="display:none;"></li>

[dbox]

@tmaiaroto Have a chance to look into this?

[dbox]

//cc @aicarlson

[andrewicarlson]

This weekend is tight, but I'll look into it further as soon as I can.

[dbox]

Np. Thanks!
On Sun, May 3, 2015 at 9:52 AM Andrew Carlson notifications@github.com
wrote:

This weekend is tight, but I'll look into it further as soon as I can.

—
Reply to this email directly or view it on GitHub
#75 (comment).

[dbox]

Ideally would love to get this guy fixed before 2.0, so that the last version of 1.x.x is super stable as well.

[connorwyatt]

I see, I can't replicate this issue, might have another look at some point

[dbox]

I never could either. @tmaiaroto or @simonv4549 can you put your test page back up and we'll give it another look. thanks!

[connorwyatt]

Yeah that would help
On 21 May 2015 16:20, "Daniel Box" notifications@github.com wrote:

I never could either. @tmaiaroto https://github.com/tmaiaroto or
@simonv4549 https://github.com/simonv4549 can you put your test page
back up and we'll give it another look. thanks!

—
Reply to this email directly or view it on GitHub
#75 (comment).

[andrewicarlson]

Sorry guys, I fully intended to look into this further since I was able to replicate but I've just been slammed with work recently.

[dbox]

:iknowthatfeel:

[connorwyatt]

Could you replicate the issue?

On 21 May 2015, at 16:25, Andrew Carlson notifications@github.com wrote:

Sorry guys, I fully intended to look into this further since I was able to replicate but I've just been slammed with work recently.

—
Reply to this email directly or view it on GitHub #75 (comment).

[dbox]

@aicarlson could, yes

[andrewicarlson]

Alright, I don't have time to debug right now but the least I could do is set it up in an instance where this is an issue.

http://codepen.io/aicarlson/full/EjgvzW/

Chrome 43.0.2357.65 (64-bit) (This is what I'm in now, it happens in more browsers)
Mac OSX Yosemite

Reduce the screen size to ~400px and you'll see that the last row of icons resizes differently than the preceding 3 rows.

[dbox]

Thanks @aicarlson

[andrewicarlson]

It's the least I can do, sorry I can't be of more help! If you aren't able to replicate it on there let me know.

Date: Thu, 21 May 2015 08:41:46 -0700
From: notifications@github.com
To: rrssb@noreply.github.com
CC: aicarlson@outlook.com
Subject: Re: [rrssb] Not rendering correclty issue (#75)

Thanks @aicarlson

—
Reply to this email directly or view it on GitHub.

[dbox]

I'm seeing it there.

[connorwyatt]

Right I see too. This will need sorting as it will still be present in 2.0 otherwise

[connorwyatt]

I'll take a look in a bit

[connorwyatt]

Me too

On 21 May 2015, at 16:44, Daniel Box notifications@github.com wrote:

I'm seeing it there.

—
Reply to this email directly or view it on GitHub #75 (comment).

[dbox]

@joshuatuscan Any ideas on this guy? (See @aicarlson's code pen a few posts up)

[connorwyatt]

I might be able to find out what is wrong as im building 2.0 up incrementally, at the moment I have no idea though

[dbox]

@aicarlson Do you still have that codepen somewhere? Link is 404ing for me.

[andrewicarlson]

I don't, I think I cleaned it out a little while back. I could replicate it
for you again, I'll try to get that to you guys today.

On Tue, Dec 8, 2015 at 8:48 PM, Daniel Box notifications@github.com wrote:

@aicarlson https://github.com/aicarlson Do you still have that codepen
somewhere? Link is 404ing for me.

—
Reply to this email directly or view it on GitHub
#75 (comment).

[dbox]

@aicarlson No worries. I just did it.

This is definitely still happening. Currently happening in Chrome, but not Safari or Firefox for me:

http://codepen.io/dbox/full/vLONzd/

[NajibF]

In my case this is happing not in the first loop but other loops in Chrome just for Icons not buttons, but if I change the browser size smaller enough the button disappeared and now it shows the icons.

[NajibF]

So, Is there an option to turn off the button and only show the icon?

[dbox]

@oskar9 it does that automatically below a certain size ...

I've never seen that issue. Feel free to hop in chat to help debug your specific case: https://gitter.im/kni-labs/rrssb?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge

Multiple instances per page weren't part of the original scope of the project, but we'll keep trying to get it working.

[NajibF]

Here is a big pic my demo.php that demostrate my issue:

[andrewicarlson]

I'm poking around at this again in my 'spare' time. I thought it might have something to do with the debounce function but that was a false positive.

[dbox]

Spare time? What's that!

[andrewicarlson]

@dbox Good question, I'll let you know when I find out!

[dbox]

:) Thanks for poking around again!

[dbox]

Anyone have any new insight on this? Multiple instances weren't really part of the initial plan for this repo, so going to close this for now. If anyone is able to get a fix going please submit a PR. Thanks!