Как назначить пару значений ключа массиву объектов с помощью сценария автоматизации тестирования forEach l oop in javascript nightwatch. js? - PullRequest
Новая
       49

Как назначить пару значений ключа массиву объектов с помощью сценария автоматизации тестирования forEach l oop in javascript nightwatch. js?

0 голосов
/ 26 мая 2020

// Я создал al oop, чтобы добавить индексный номер [1-16] в конец селектора xpath (это селекторы для элементов li на веб-сайте, они все одинаковы, за исключением номера индекса на конец.) Затем я хочу назначить этот селектор существующему массиву объектов в качестве значения для ключа с именем «ссылка». Затем я хочу вызвать специальную команду для l oop через массив и щелкнуть каждую пару значений ключа. Это сделано для того, чтобы щелкнуть ссылки (селекторы xpath) и убедиться, что автоматизация попадает на правильную страницу, которую я проверяю с помощью URL-адреса. Каждый объект в массиве имеет 2 пары ключ-значение, ссылку и URL-адрес. Я пробовал делать это, просто добавляя селекторы к обычному массиву, и он отлично работает таким образом. Но когда я пытаюсь добавить селектор в массив как часть объекта, я получаю ошибки. Мой код ниже:

// Вот где я хочу назначить только что объединенный селектор xpath для моего массива объектов. Я пробовал map, pu sh, concat, assign и все другие функции, которые я мог найти, связанные с массивами: 


for (let i = 0; i < 17; i++) { 
    abtArr[i].concat({link: abtSel + `[${i}]`})
} 

abtArr.forEach(item => {
    aosPage
        .click(item.link) 
        .verify.urlContains(item.url)
})


//object array (abtArr)

module.exports = [
    {
        link: '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div/div[2]/div[1]/div/ul/li[1]',
        url: 'https://www.aos.org/about-us/aos-membership.aspx'
    }, 
    {
        link: '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div[1]/div[2]/div[1]/div/ul/li[2]',
        url: 'https://www.aos.org/about-us/lindleyana-magazine.aspx'
    },


]

Фрагмент кода (минимальный воспроизводимый пример): 

function getElementByXpath(path) {
  return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
}

/*
const abtArr = [
    {
        link: '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div/div[2]/div[1]/div/ul/li[1]',
        url: 'https://www.aos.org/about-us/aos-membership.aspx'
    }, 
    {
        link: '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div[1]/div[2]/div[1]/div/ul/li[2]',
        url: 'https://www.aos.org/about-us/lindleyana-magazine.aspx'
    },
];
*/

// const abtSel = '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div/div[2]/div[1]/div/ul/li';
const abtSel = '//*[@id="target"]/ul/li';
const abtArr = [];

for (let i = 1; i < 11; i++) { 
    const xPath = `${abtSel}[${i}]/a`;
    const linkTag = getElementByXpath(xPath);
    const someUrl = linkTag ? linkTag.href : null;
    abtArr.push({link: xPath, url: someUrl})
} 

console.log(abtArr);
.as-console-wrapper { max-height: 100% !important; top: 0; }
<div id="target">
  <ul>
    <li><a href="example.com/1">Link</a></li>
    <li><a href="example.com/2">Link</a></li>
    <li><a href="example.com/3">Link</a></li>
    <li><a href="example.com/4">Link</a></li>
    <li><a href="example.com/5">Link</a></li>
    <li><a href="example.com/6">Link</a></li>
    <li><a href="example.com/7">Link</a></li>
    <li><a href="example.com/8">Link</a></li>
    <li><a href="example.com/9">Link</a></li>
    <li><a href="example.com/10">Link</a></li>
  </ul>
</div>

1 Ответ

0 голосов
/ 27 мая 2020

Если я правильно понимаю, ваша проблема как бы противоположна этой:

«Вы создаете 16 xPaths на лету, например 'div / ul / li [n]', где n = от 1 до 16 и для каждого из них вы выбираете этот элемент и проверяете, что такое href гиперссылки, независимо от гиперссылки, которую вы сохраняете в свойстве URL вашего объекта, а pu sh этот объект в массив, например [{link: 'div/ul/li[n]', URL: 'example.com/[n]'}] "(см. противоположное на внизу)

Вот фрагмент кода (минимальный воспроизводимый пример) с HTML и JS (то же, что я поставил в вашем вопросе в качестве примера):

Кроме того, это выглядит например, вы используете node и Nightwatch, вы должны отметить их в вопросе (что я сделал сейчас - должно помочь нужным людям найти вопрос et c.) и добавить хотя бы минимальные операторы импорта и начальные данные et c.

Это то, что вы пытаетесь делать? (Но, конечно, этот пример предназначен только для клиента, поэтому он не один к одному, но, по крайней мере, должен дать вам представление) 

function getElementByXpath(path) {
  return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
}

/*
const abtArr = [
    {
        link: '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div/div[2]/div[1]/div/ul/li[1]',
        url: 'https://www.aos.org/about-us/aos-membership.aspx'
    }, 
    {
        link: '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div[1]/div[2]/div[1]/div/ul/li[2]',
        url: 'https://www.aos.org/about-us/lindleyana-magazine.aspx'
    },
];
*/

// const abtSel = '//*[@id="aspnetForm"]/div[4]/section/div[1]/div/div[2]/div/div[2]/div[1]/div/ul/li';
const abtSel = '//*[@id="target"]/ul/li';
const abtArr = [];

for (let i = 1; i < 11; i++) { 
    const xPath = `${abtSel}[${i}]/a`;
    const linkTag = getElementByXpath(xPath);
    const someUrl = linkTag ? linkTag.href : null;
    abtArr.push({link: xPath, url: someUrl})
} 

console.log(abtArr);
/*.as-console-wrapper { max-height: 100% !important; top: 0; }*/
<div id="target">
  <ul>
    <li><a href="example.com/1">Link</a></li>
    <li><a href="example.com/2">Link</a></li>
    <li><a href="example.com/3">Link</a></li>
    <li><a href="example.com/4">Link</a></li>
    <li><a href="example.com/5">Link</a></li>
    <li><a href="example.com/6">Link</a></li>
    <li><a href="example.com/7">Link</a></li>
    <li><a href="example.com/8">Link</a></li>
    <li><a href="example.com/9">Link</a></li>
    <li><a href="example.com/10">Link</a></li>
  </ul>
</div>

Вывод: 

[
  {
    "link": "//*[@id=\"target\"]/ul/li[1]/a",
    "url": "https://stacksnippets.net/example1.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[2]/a",
    "url": "https://stacksnippets.net/example2.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[3]/a",
    "url": "https://stacksnippets.net/example3.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[4]/a",
    "url": "https://stacksnippets.net/example4.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[5]/a",
    "url": "https://stacksnippets.net/example5.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[6]/a",
    "url": "https://stacksnippets.net/example6.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[7]/a",
    "url": "https://stacksnippets.net/example7.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[8]/a",
    "url": "https://stacksnippets.net/example8.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[9]/a",
    "url": "https://stacksnippets.net/example9.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[10]/a",
    "url": "https://stacksnippets.net/example10.com"
  }
]

Итак, если ваша проблема противоположная, то есть тогда:

" У вас есть 16 предопределенных xPath, таких как 'div / ul / li [n]', где n = от 1 до 16, и для каждого из них у вас есть предварительно определенный URL-адрес, который вы ожидаете, что этот тег элемента / ссылки списка будет содержать, вы хотите затем щелкните эту ссылку, и вы утверждаете, что ссылка, по которой вы переходите, совпадает с ссылкой xpath в массиве, например [{link: 'div/ul/li[n]', URL: 'example.com/[n]'}] "

Вы хотите использовать для этого Node и Nightwatch.

Вы могли бы сделать это так, я полагаю: 

function getElementByXpath(path) {
  return document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
}

const abtArr = [
  {
    "link": "//*[@id=\"target\"]/ul/li[1]/a",
    "url": "https://stacksnippets.net/example1.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[2]/a",
    "url": "https://stacksnippets.net/example2.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[3]/a",
    "url": "https://stacksnippets.net/example3.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[4]/a",
    "url": "https://stacksnippets.net/example4.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[5]/a",
    "url": "https://stacksnippets.net/example5.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[6]/a",
    "url": "https://stacksnippets.net/example6.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[7]/a",
    "url": "https://stacksnippets.net/example7.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[8]/a",
    "url": "https://stacksnippets.net/example8.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[9]/a",
    "url": "https://stacksnippets.net/example9.com"
  },
  {
    "link": "//*[@id=\"target\"]/ul/li[10]/a",
    "url": "https://stacksnippets.net/example10.com"
  }
];

abtArr.forEach(item => {
    
    const aTag = getElementByXpath(item.link);
    console.log(aTag);
    aTag.target = "_blank";
    aTag.click();

  	//Somehow verify that the new tab opened contains the pre-defined url:
    //.verify.urlContains(item.url)
})
<div id="target">
  <ul>
    <li><a href="example.com/1">Link</a></li>
    <li><a href="example.com/2">Link</a></li>
    <li><a href="example.com/3">Link</a></li>
    <li><a href="example.com/4">Link</a></li>
    <li><a href="example.com/5">Link</a></li>
    <li><a href="example.com/6">Link</a></li>
    <li><a href="example.com/7">Link</a></li>
    <li><a href="example.com/8">Link</a></li>
    <li><a href="example.com/9">Link</a></li>
    <li><a href="example.com/10">Link</a></li>
  </ul>
</div>
...