Popper-core: [IE10] Wrong viewport boundaries computation

[atomiks]

I believe this is an issue on Popper's end, and although IE10 doesn't really matter anymore (works fine on IE11), just checking:

---

Demo

https://codepen.io/FezVrasta/full/QvyNvY/

Steps to reproduce the problem

Scroll down on IE10

What is the expected behavior?

Tooltips should be positioned correctly, sticking to the element

What went wrong?

Tooltip instead scrolls with the scrollbar

[FezVrasta]

I need a test case based on the template provided in the issues. Or even better, a PR that introduces a failing test for your problem.

I have opened popper.js.org on IE10 and the examples work fine, the same happens for our test suite that passes on IE10 so at first I'd say it's a problem with Tippy.js?

[atomiks]

I'll test the previous popper version with the new standalone tippy

[FezVrasta]

I would suggest to add an automated test suite to Tippy if you want to avoid lot of problems in future. Automated tests are invaluable.

[atomiks]

The old version works with tippy.standalone, so...

[FezVrasta]

Ok then please provide the test case as required and I'll take a look

[atomiks]

I'll definitely set up tests tomorrow for the library

What kind of test case do you need? I haven't written one in this type of scenario before

[FezVrasta]

It's enough to edit the bug report template:
https://github.com/FezVrasta/popper.js/blob/master/.github/ISSUE_TEMPLATE.md

[FezVrasta]

Any updates on this @atomiks ?

[atomiks]

Sorry, not sure what you mean by edit the report template. Edit it with the test case? Can you give an example of what you need?

[FezVrasta]

Take this:
https://codepen.io/FezVrasta/pen/wGqJEz

Update the code to make it reproduce the problem (particular markup, css, anything?)

I need a way to see the bug just opening the codepen without having to debug 3rd party code.

[atomiks]

Ah okay, that makes it clear. I'll try to make a failing test

[atomiks]

Okay here we go: https://codepen.io/anon/pen/QvbejQ

On IE10, it will scroll down with it rather than stick to the element.

Gif: https://i.gyazo.com/77cb6a3c82b7535f079d9fedd5895c94.mp4

[FezVrasta]

How's that on Chrome I see the tooltip above the button? Is it expected? 😕

In the Pen I see you import Tippy.js and its CSS, can you get rid of them to make it easier to debug the problem pls?

[atomiks]

Updated (2). The misalignment on Chrome was due to the html, body { margin: 2rem; }

[FezVrasta]

Ok, so... we have problems with margins applied to html, nice... The tests we have seems useless in this case 😓 And we have a scrollTop problem in IE10...

Thank you

[FezVrasta]

This (#217) should fix the problems with the positioning on all browsers.

Tomorrow I'll take a look at the IE10 specific bug.

Edit: confirmed that the first problem has been fixed:

[atomiks]

Any idea when this will be fixed?

[FezVrasta]

I think within today, but I have other things scheduled that needs my attention.

[FezVrasta]

It's trickier than I thought, I added a failing test but I can't find a way to fix the problem without breaking other stuff.

Moving to priority low because the cross browser bugs have been fixed and there's only this IE10 bug remaining.

[atomiks]

Tippy seems to work in IE10 properly now with 1.9.1, has it been fixed?

Edit: Seems like position: 'bottom' does not work, but not that big of a deal

[atomiks]

Closing this because the codepen and Tippy work in IE10 now, guess you fixed it somehow...