How to Inspect an element that only appears when I do Hover on another element?

Question

I have an element that when making a hover in it will appear a pseudo-element elsewhere on the screen, however I would like to inspect this pseudo-element when it is visible on the screen.

How do I inspect an element that only appears when the other is with hover?

Look at this simple example

button {
  position: relative;
}
button::after {
  content: "";
  display: inline-block;
  margin-left: 150px;
  background-color: red;
  position: absolute;
}
button:hover::after {
  content: "aqui!";
}

<button>button</button>

Answer 1

Follow the steps:

1. Click on the element you need to give the hover and Inspecione element in it.

2. In HTML check that this element is selected and you will see on the right an item :hov

3. Click on :hov and select :hover.

Ready just inspect the element that appeared on the screen and no longer comes out.

To the Firefox, instead of the button :hov there is the icon title "Toggle pseudo-classes".