Страница кукловода оценивает, чтобы собрать изображение - но не получает измененное изображение - PullRequest
0 голосов
/ 28 февраля 2020

Надеюсь, кто-нибудь может помочь. У меня возникла странная ситуация, когда кукловод распознавал новые изображения по щелчкам при смене цвета, но не по ползунку. Когда я делаю снимок экрана после каждого щелчка, снимок экрана каждый раз отражает новое изображение, но когда я загружаю изображение, оно не работает при втором наборе щелчков. Приведенный ниже фрагмент кода основан на следующем сайте для целей тестирования.

https://www.volkswagen.com.au/app/configurator/vw-au/en/polo/30203/38600/70tsi-trendline/AW12LV-GPBAPBA-GPH2PH2-GPJ1PJ1-GPU2PU2-GPWGPWG-GZEXZEX/2020/0/F14%200Q0Q/F56%20%20%20%20%20EL/+?page=exterior&postcode=2000

Код сначала собирает все параметры цвета, что прекрасно работает. Затем я go и нажимаю на слайдер изображений, чтобы получить все остальные изображения, которые не работают, даже если это тот же контейнер изображений / sr c, который отправляется в функцию загрузки изображений.

Почему бы 1-й набор кликов получает все правильные изображения, а 2-й набор кликов нет?

Я пытался получить изображение sr c с XPATH, а также с помощью page.evaluate, и у них обоих есть та же проблема. Я что-то здесь упускаю?

Я установил headless: false для просмотра процесса и все нормально в Chrome ...

    const clickCollect = async (imageSrc, name) => {
       await page.screenshot({ path: name + '_screenshot.png' });    
       // download image code comes here .. using axios
    };

    rotationLinks = await page.$x(
      "//div[starts-with(@class,'grid-cell card card-single-select')]"
    );
    console.log('Found ' + rotationLinks.length + ' colours');

    //**some other code to confirm we get the images **//


    const rotationLinksTxt = await page.$x(
      "//p[@class='copy copy--1 copy--bold card-content-colors__name']/text()"
    );

    var tempImage;
    var imageSrc;
    for (var x = 0; x < rotationLinks.length; x++) {
      var colourName = await page.evaluate(
        p => p.textContent,
        rotationLinksTxt[x]
      );
      await rotationLinks[x].click();
      await page.waitFor(3500);
      tempImage = await page.evaluate(() => {
        return Array.from(
          document.querySelectorAll(
            '.image.image--full-width.image-with-placeholder__image.image-with-placeholder__image--needs-ratio'
          ),
          img => img.src
        );
      });
      imageSrc = tempImage[0];
      await clickCollect(
        imageSrc,
        colourName.replace(' ', '_')
      ).catch(function(err) {
        'collecting image failed: ' + err;
      });
      await page.waitFor(3500);

      console.log('Done with the main colour images');

      console.log('Looking for additional model images');

      const additionalImages = await page.$x(
        "//span[@class='lentil lentil--clickable']"
      );

      console.log('Found ' + additionalImages.length + ' additional images');

      for (var a = 0; a < additionalImages.length; a++) {
        await additionalImages[a].click();
        await page.waitFor(3500);
        tempImage = await page.evaluate(() => {
          return Array.from(
            document.querySelectorAll(
              '.image.image--full-width.image-with-placeholder__image.image-with-placeholder__image--needs-ratio'
            ),
            img => img.src
          );
        });
        imageSrc = tempImage[0];
        await page.waitFor(3500);
        await clickCollect(
          imageSrc,
          a + colourName.replace(' ', '_')
        ).catch(function(err) {
          'collecting image failed: ' + err;
        });
        await page.waitFor(3500);
      }
      return false;
    }

...