fix: pagination ui

This commit is contained in:
Rohit Rajan
2025-11-30 22:11:01 +05:30
parent 2f0516f7f9
commit b2fcf021f2
2 changed files with 12 additions and 4 deletions

View File

@@ -1686,6 +1686,12 @@ export const BrowserWindow = () => {
} }
}, [paginationMode, resetPaginationSelector]); }, [paginationMode, resetPaginationSelector]);
useEffect(() => {
if (!paginationMode || !getList) {
setHighlighterData(null);
}
}, [paginationMode, getList]);
useEffect(() => { useEffect(() => {
if (paginationMode && currentListActionId) { if (paginationMode && currentListActionId) {
const currentListStep = browserSteps.find( const currentListStep = browserSteps.find(
@@ -1841,7 +1847,7 @@ export const BrowserWindow = () => {
> >
{/* Individual element highlight (for non-group or hovered element) */} {/* Individual element highlight (for non-group or hovered element) */}
{((getText && !listSelector) || {((getText && !listSelector) ||
(getList && paginationMode && paginationType !== "" && (getList && paginationMode && !paginationSelector && paginationType !== "" &&
!["none", "scrollDown", "scrollUp"].includes(paginationType))) && ( !["none", "scrollDown", "scrollUp"].includes(paginationType))) && (
<div <div
style={{ style={{
@@ -1909,6 +1915,7 @@ export const BrowserWindow = () => {
listSelector && listSelector &&
!paginationMode && !paginationMode &&
!limitMode && !limitMode &&
captureStage === 'initial' &&
highlighterData.similarElements?.rects?.map((rect, index) => ( highlighterData.similarElements?.rects?.map((rect, index) => (
<React.Fragment key={`item-${index}`}> <React.Fragment key={`item-${index}`}>
<div <div

View File

@@ -268,6 +268,7 @@ export const DOMBrowserRenderer: React.FC<RRWebDOMBrowserRendererProps> = ({
shouldHighlight = false; shouldHighlight = false;
} else if ( } else if (
paginationMode && paginationMode &&
!paginationSelector &&
paginationType !== "" && paginationType !== "" &&
!["none", "scrollDown", "scrollUp"].includes(paginationType) !["none", "scrollDown", "scrollUp"].includes(paginationType)
) { ) {
@@ -353,7 +354,7 @@ export const DOMBrowserRenderer: React.FC<RRWebDOMBrowserRendererProps> = ({
const options: boolean | AddEventListenerOptions = ['wheel', 'touchstart', 'touchmove'].includes(event) const options: boolean | AddEventListenerOptions = ['wheel', 'touchstart', 'touchmove'].includes(event)
? { passive: false } ? { passive: false }
: false; : false;
iframeDoc.removeEventListener(event, handler as EventListener, options); iframeDoc.removeEventListener(event, handler as EventListener, options);
}); });
} }
@@ -588,7 +589,7 @@ export const DOMBrowserRenderer: React.FC<RRWebDOMBrowserRendererProps> = ({
const elementRect = element.getBoundingClientRect(); const elementRect = element.getBoundingClientRect();
const relativeX = iframeX - elementRect.left; const relativeX = iframeX - elementRect.left;
const relativeY = iframeY - elementRect.top; const relativeY = iframeY - elementRect.top;
socket.emit("dom:click", { socket.emit("dom:click", {
selector, selector,
url: snapshot.baseUrl, url: snapshot.baseUrl,
@@ -636,7 +637,7 @@ export const DOMBrowserRenderer: React.FC<RRWebDOMBrowserRendererProps> = ({
if (iframe) { if (iframe) {
const focusedElement = iframeDoc.activeElement as HTMLElement; const focusedElement = iframeDoc.activeElement as HTMLElement;
let coordinates = { x: 0, y: 0 }; let coordinates = { x: 0, y: 0 };
if (focusedElement && focusedElement !== iframeDoc.body) { if (focusedElement && focusedElement !== iframeDoc.body) {
// Get coordinates from the focused element // Get coordinates from the focused element
const rect = focusedElement.getBoundingClientRect(); const rect = focusedElement.getBoundingClientRect();