Improve arrow modifier docs

CodePen demo

https://codepen.io/anon/pen/BJpmjz

Steps to reproduce the problem

1. arrowElement set to div where I will place the arrow
2. Print value of data.arrowElement in onUpdate callback

What is the expected behavior?

Arrow div is printed to the console and placed between the reference and popper div.

What went wrong?

The arrow div is not positioned and not returned in the callback as if it’s ignored. This results in the value undefined being printed to the console.

Any other comments?

I couldn’t really find documentation nor examples of including an arrow with the popper on the internet at all, so specifying it as arrowElement in the Popper constructor is a guess, but I hoped it would work. What is the correct solution?

[janwidmer]

@Overv It’s always a trade between flexibility and presets… not generating any markup give’s you all the options to use whatever markup for your popover.

The needed markup is very simple:

<div class="popper" id="example3popper1">
   <p>Your content</p>
    <div class="popper__arrow" x-arrow=""></div>
</div>

[FezVrasta]

This is just a documentation ticket, there’s nothing broken with the library.