How can I get text from invisible label by using wallaby code?

Question

I have invisible text label and I can't get the text from it.

the elements are a list of rows like these:

<datatable-body-cell tabindex="-1" class="datatable-body-cell 
  sort-active" style="width: 178.667px; height: 67px;">
  <div class="datatable-body-cell-label">
      <label _ngcontent-c13="" class="m-0 visible-element" 
       id="visible_element">
      example
      </label>

    <label _ngcontent-c13="" class="m-0 invisible-element" 
     id="invisible_element" style="z-index: -1; display: none">
    invisible label
    </label>
  </div>
</datatable-body-cell>

I tried:

session
|> find(css(".datatable-row-wrapper", count: :any))  
|> Enum.each(fn element ->
   Wallaby.Browser.find(element, (
     css("#invisible_element", visible: false)))
     |> Element.text()
     |> IO.inspect()
     end)

I expected the output to be "invisible label" , but the actual output is ""

Answer 1

I got a solution from github:

session
|> find(css(".datatable-row-wrapper", count: :any))
|> Enum.each(fn element ->
        Element.attr(find(element, css("#test_test", visible: false)), "innerHTML")
        |> Element.text()
        |> IO.inspect()
      end)

this got me the invisible text