In Firefox flippy-front part does not render correctly

[forethoughtde]

There is an issue in rendering flippy-front part for the very first request. After that, it does work fine.

[zwacky]

if i run the example in firefox and it does work. what is not working in yours exactly?

[forethoughtde]

I have the following code in the

<p style="font-size: 8px">{{quiz.header}}</p>
                        <p id="quizQuestion">{{quiz.fragnummer}}</p>
                        <h3 class="quiz-question" ng-style="'color: #5b5b5b'">
                            {{quiz.question}}
                        </h3>
                         <!--   <img ng-src="res/{{quiz.image}}" height="42" width="42" alt="Image missing">-->
                        <form novalidate name="qChoices" ng-if="quiz.choices.length > 0">
                            <li class="possibleAnswers" ng-repeat="choice in quiz.choices track by $index">
                                <input type="checkbox" name="selectedChoices[]" background-directive="backColor" value="{{choice}}" ng-checked="selection.indexOf(choice) > -1" ng-click="toggleSelection(choice, $parent.$index)"> {{choice}}
                            </li>
                        </form>
                        <button type="submit" ng-click="evaluationAnswers($parent.$index)">Evaluate Answers</button>
                            <p style="font-size: 8px">{{quiz.footer}}</p>

This part of screen does not get render well for the very first request in Firefox 46. When I mouse over the part it get displayed.

[forethoughtde]

The problem is just with Firefox. I have tested it on Microsoft Edge, Internet Explorer 10, Chrome and Safari.

[zwacky]

i'm using firefox 46 too and it works, but using mac.

can you create a jsbin or fiddle for this?

[forethoughtde]

Please check the link to see http://lms.dickemann-weber.com/Quiz

[zwacky]

closing due to non-reproducible

[wbarrionuevo]

Bug is still reproducible on Firefox 53.0.2 for Windows. I managed to solve it by adding "-moz-perspective: none;" to flippy in angular-flippy.css

[zwacky]

Very weird... I now tested it on browserstack with win 7 and win 10, both firefox 53 with this example: http://jsbin.com/panizijuka/1/edit?html,css,js,output and it did work...

Am i missing something?

[wbarrionuevo]

Maybe it's not reproducible with the demo page, i can give it a try tomorrow. The application where i was able to see the issue render a lot of cards inside a ng-repeat loop, which is displayed depending on a ng-show statement. If you want i can take a few screenshots without the fix i mentioned.

[zwacky]

A jsbin/plunkr would be better of course. otherwise always open to PRs 😊

[wbarrionuevo]

I was able to reproduce with the demo from cloned repo, as seen on print below.

However, i was not able to reproduce it using the same code on jsbin, pretty weird. The PR i made seems to fix it.

[zwacky]

thank you! merged your PR and released the v2.1.1 version - also published on npm. 👍