fix: pagination ui
This commit is contained in:
@@ -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
|
||||||
|
|||||||
@@ -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();
|
||||||
|
|||||||
Reference in New Issue
Block a user