Merge pull request #26 from amhsirak/develop

fix: `getList` highlighter race condition
This commit is contained in:
Karishma Shukla
2024-09-09 03:21:38 +05:30
committed by GitHub
3 changed files with 21 additions and 12 deletions

View File

@@ -485,12 +485,12 @@ export class WorkflowGenerator {
const generalSelector = await getNonUniqueSelectors(page, coordinates)
const childSelectors = await getChildSelectors(page, generalSelector.generalSelector);
console.log('Non Unique Selectors [DEBUG]:', generalSelector);
console.log('Child Selectors [DEBUG]:', childSelectors);
console.log(`Get List value while generating selector`, this.getList);
const selectorBasedOnCustomAction = (this.getList === true)
? await getNonUniqueSelectors(page, coordinates)
: await getSelectors(page, coordinates);
const bestSelector = getBestSelectorForAction(
{
type: action,
@@ -522,13 +522,13 @@ export class WorkflowGenerator {
if (this.listSelector !== '') {
const childSelectors = await getChildSelectors(page, this.listSelector || '');
this.socket.emit('highlighter', { rect, selector: displaySelector, elementInfo, childSelectors })
} else {
this.socket.emit('highlighter', { rect, selector: displaySelector, elementInfo });
}
} else {
this.socket.emit('highlighter', { rect, selector: displaySelector, elementInfo });
}
}
// reset getList after usage
this.getList = false;
}
/**

View File

@@ -112,28 +112,29 @@ export const BrowserWindow = () => {
const highlighterHandler = useCallback((data: { rect: DOMRect, selector: string, elementInfo: ElementInfo | null, childSelectors?: string[] }) => {
if (getList === true) {
socket?.emit('setGetList', { getList: true });
if (listSelector) {
socket?.emit('listSelector', { selector: listSelector });
if (paginationMode) {
// Pagination mode: only set highlighterData if type is not empty, 'none', 'scrollDown', or 'scrollUp'
if (paginationType !== '' && paginationType !== 'scrollDown' && paginationType !== 'scrollUp' && paginationType !== 'none') {
// only set highlighterData if type is not empty, 'none', 'scrollDown', or 'scrollUp'
if (paginationType !== '' && !['none', 'scrollDown', 'scrollUp'].includes(paginationType)) {
setHighlighterData(data);
} else {
setHighlighterData(null);
}
} else if (data.childSelectors && data.childSelectors.includes(data.selector)) {
// !Pagination mode: highlight only valid child elements within the listSelector
// highlight only valid child elements within the listSelector
setHighlighterData(data);
} else {
// If not a valid child in normal mode, clear the highlighter
// if !valid child in normal mode, clear the highlighter
setHighlighterData(null);
}
} else {
setHighlighterData(data); // Set highlighterData for the initial listSelector selection
// set highlighterData for the initial listSelector selection
setHighlighterData(data);
}
} else {
setHighlighterData(data); // For non-list steps
// for non-list steps
setHighlighterData(data);
}
}, [highlighterData, getList, socket, listSelector, paginationMode, paginationType]);

View File

@@ -1,4 +1,5 @@
import React, { createContext, useContext, useState, ReactNode } from 'react';
import { useSocketStore } from './socket';
export type PaginationType = 'scrollDown' | 'scrollUp' | 'clickNext' | 'clickLoadMore' | 'none' | '';
export type LimitType = '10' | '100' | 'custom' | '';
@@ -39,6 +40,8 @@ export const ActionProvider = ({ children }: { children: ReactNode }) => {
const [limitType, setLimitType] = useState<LimitType>('');
const [customLimit, setCustomLimit] = useState<string>('');
const {socket} = useSocketStore();
const updatePaginationType = (type: PaginationType) => setPaginationType(type);
const updateLimitType = (type: LimitType) => setLimitType(type);
const updateCustomLimit = (limit: string) => setCustomLimit(limit);
@@ -52,9 +55,14 @@ export const ActionProvider = ({ children }: { children: ReactNode }) => {
const startGetText = () => setGetText(true);
const stopGetText = () => setGetText(false);
const startGetList = () => setGetList(true);
const startGetList = () => {
setGetList(true);
socket?.emit('setGetList', { getList: true });
}
const stopGetList = () => {
setGetList(false);
socket?.emit('setGetList', { getList: false });
setPaginationType('');
setLimitType('');
setCustomLimit('');