Как получить текущий целевой (или выбранный в данный момент) элемент пользовательского интерфейса, используя puppeteer и NodeJS API - PullRequest
0 голосов
/ 23 октября 2019

Я новичок в использовании API кукловода и chrome-dev-tools. Я пытаюсь получить выбранный в данный момент элемент, то есть event.Target, из контекста браузера в экземпляр Node / Puppeteer, чтобы потом преобразовать его в JSON для использования в дальнейшем. Я попробовал приведенные ниже методы, но ни один из них, по-видимому, не является решением моей постановки проблемы.

Подход 1. Я пытался извлечь элемент, используя комбинацию page.exposeFunction () и page.evaluate ()функции, но значение, выведенное в консоль узла, похоже на какой-то другой оконный подобъект вместо WebElement, однако консоль браузера может печатать это значение безупречно как Webelement

const pptr = require('puppeteer-core');
const EventEmitter = require("events");
const myEventTracker = new EventEmitter();

const runScript = async function(){

    const browser = await pptr.launch({
        headless:false,
        executablePath:'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
    });

    const page = await browser.newPage();
    await page.goto('<APPLICATION URL>');
    await page.evaluate(async function(){
        document.addEventListener('click',async function(e){
            fetchElement(e.target);
        })
    })

    await page.exposeFunction('fetchElement',async function(args){
        console.log(await args);
    })

    myEventTracker.on(Event,function(e){
        console.log(e);
    })
}

runScript();

. В приведенном выше подходе выводнапечатано fetchElement () как показано ниже:

{ __zone_symbol__ngModelChangefalse:
   [ { type: 'eventTask',
       state: 'scheduled',
       source: 'HTMLInputElement.addEventListener:ngModelChange',
       zone: 'angular',
       runCount: 0 } ],
  __zone_symbol__keydownfalse:
   [ { type: 'eventTask',
       state: 'scheduled',
       source: 'HTMLInputElement.addEventListener:keydown',
       zone: '<root>',
       runCount: 0 } ],
  __zone_symbol__inputfalse:
   [ { type: 'eventTask',
       state: 'scheduled',
       source: 'HTMLInputElement.addEventListener:input',
       zone: 'angular',
       runCount: 0 } ],
  __zone_symbol__blurfalse:
   [ { type: 'eventTask',
       state: 'scheduled',
       source: 'HTMLInputElement.addEventListener:blur',
       zone: 'angular',
       runCount: 0 } ],
  __zone_symbol__compositionstartfalse:
   [ { type: 'eventTask',
       state: 'scheduled',
       source: 'HTMLInputElement.addEventListener:compositionstart',
       zone: 'angular',
       runCount: 0 } ],
  __zone_symbol__compositionendfalse:
   [ { type: 'eventTask',
       state: 'scheduled',
       source: 'HTMLInputElement.addEventListener:compositionend',
       zone: 'angular',
       runCount: 0 } ] }

Вместо того, что ниже, которое отлично печатается в консоли браузера:

<h4 id="the-observer-pattern-for-our-event-emitter">The Observer Pattern for Our Event Emitter</h4>

Подход 2:

Второй подходя пытался использовать EventEmiter, но мне не повезло в использовании того же самого, а также я получаю необработанное отклонение обещания, независимо от того, что я делаю.

Пожалуйста, помогите / предложите любой другой метод, с помощью которого я могу получить целевой / нажатый WebElementиз живого экземпляра Chrome. Заранее спасибо:)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...