Our application is react and we have a table with more than 25 rows, but at a time it will load 25 rows as paginated. When I try to inspect the element and get the count of rows, I am getting only 20 or less from the console. Is there anyway that we can change the browser settings to show the hidden content for all the rows that displayed in the application?
screenshot from the application shows I selected 25 records enter image description here
screenshot from the console enter image description here
<tbody class="MuiTableBody-root-717 jss661" style="display: table-row-group;">
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-128-highlight" style="position: absolute; transform: translateY(0px); min-width: 100%; background-color: rgb(255, 255, 255);">
</tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
<tr class="jss674" aria-label="trade-data-row-lineitem-004-10540141-619-highlight" style="position: absolute; transform: translateY(35px); min-width: 100%; background-color: rgb(235, 238, 241);"></tr>
I checked with my developers, and they said it is something to do with the browser as it is blocking by the browser.