சோதனைகளை எழுதுதல்
டெஸ்ட்ரன்னர் கட்டமைப்பு ஆதரவு
@wdio/visual-service
டெஸ்ட்-ரன்னர் கட்டமைப்பு சாராதது, அதாவது நீங்கள் இதை WebdriverIO ஆதரிக்கும் அனைத்து கட்டமைப்புகளுடனும் பயன்படுத்தலாம், அவை:
உங்கள் சோதனைகளுக்குள், நீங்கள் திரைப்பிடிப்புகளை சேமிக்கலாம் அல்லது உங்கள் பயன்பாட்டின் தற்போதைய காட்சி நிலையை ஒரு அடிப்படை நிலையுடன் பொருத்தலாம். இதற்காக, இந்த சேவை தனிப்பயன் பொருத்தி மற்றும் சரிபார்ப்பு முறைகளை வழங்குகிறது:
- Mocha
- Jasmine
- CucumberJS
describe('Mocha Example', () => {
beforeEach(async () => {
await browser.url('https://webdriver.io')
})
it('using visual matchers to assert against baseline', async () => {
// Check screen to exactly match with baseline
await expect(browser).toMatchScreenSnapshot('partialPage')
// check an element to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchScreenSnapshot('partialPage', 5)
// check an element with options for `saveScreen` command
await expect(browser).toMatchScreenSnapshot('partialPage', {
/* some options */
})
// Check an element to exactly match with baseline
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement')
// check an element to have a mismatch percentage of 5% with the baseline
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement', 5)
// check an element with options for `saveElement` command
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement', {
/* some options */
})
// Check a full page screenshot match with baseline
await expect(browser).toMatchFullPageSnapshot('fullPage')
// Check a full page screenshot to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchFullPageSnapshot('fullPage', 5)
// Check a full page screenshot with options for `checkFullPageScreen` command
await expect(browser).toMatchFullPageSnapshot('fullPage', {
/* some options */
})
// Check a full page screenshot with all tab executions
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable')
// Check a full page screenshot to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable', 5)
// Check a full page screenshot with options for `checkTabbablePage` command
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable', {
/* some options */
})
})
it('should save some screenshots', async () => {
// Save a screen
await browser.saveScreen('examplePage', {
/* some options */
})
// Save an element
await browser.saveElement(
await $('#element-id'),
'firstButtonElement',
{
/* some options */
}
)
// Save a full page screenshot
await browser.saveFullPageScreen('fullPage', {
/* some options */
})
// Save a full page screenshot with all tab executions
await browser.saveTabbablePage('save-tabbable', {
/* some options, use the same options as for saveFullPageScreen */
})
})
it('should compare successful with a baseline', async () => {
// Check a screen
await expect(
await browser.checkScreen('examplePage', {
/* some options */
})
).toEqual(0)
// Check an element
await expect(
await browser.checkElement(
await $('#element-id'),
'firstButtonElement',
{
/* some options */
}
)
).toEqual(0)
// Check a full page screenshot
await expect(
await browser.checkFullPageScreen('fullPage', {
/* some options */
})
).toEqual(0)
// Check a full page screenshot with all tab executions
await expect(
await browser.checkTabbablePage('check-tabbable', {
/* some options, use the same options as for checkFullPageScreen */
})
).toEqual(0)
})
})
describe('Jasmine Example', () => {
beforeEach(async () => {
await browser.url('https://webdriver.io')
})
it('using visual matchers to assert against baseline', async () => {
// Check screen to exactly match with baseline
await expect(browser).toMatchScreenSnapshot('partialPage')
// check an element to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchScreenSnapshot('partialPage', 5)
// check an element with options for `saveScreen` command
await expect(browser).toMatchScreenSnapshot('partialPage', {
/* some options */
})
// Check an element to exactly match with baseline
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement')
// check an element to have a mismatch percentage of 5% with the baseline
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement', 5)
// check an element with options for `saveElement` command
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement', {
/* some options */
})
// Check a full page screenshot match with baseline
await expect(browser).toMatchFullPageSnapshot('fullPage')
// Check a full page screenshot to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchFullPageSnapshot('fullPage', 5)
// Check a full page screenshot with options for `checkFullPageScreen` command
await expect(browser).toMatchFullPageSnapshot('fullPage', {
/* some options */
})
// Check a full page screenshot with all tab executions
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable')
// Check a full page screenshot to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable', 5)
// Check a full page screenshot with options for `checkTabbablePage` command
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable', {
/* some options */
})
})
it('should save some screenshots', async () => {
// Save a screen
await browser.saveScreen('examplePage', {
/* some options */
})
// Save an element
await browser.saveElement(
await $('#element-id'),
'firstButtonElement',
{
/* some options */
}
)
// Save a full page screenshot
await browser.saveFullPageScreen('fullPage', {
/* some options */
})
// Save a full page screenshot with all tab executions
await browser.saveTabbablePage('save-tabbable', {
/* some options, use the same options as for saveFullPageScreen */
})
})
it('should compare successful with a baseline', async () => {
// Check a screen
await expect(
await browser.checkScreen('examplePage', {
/* some options */
})
).toEqual(0)
// Check an element
await expect(
await browser.checkElement(
await $('#element-id'),
'firstButtonElement',
{
/* some options */
}
)
).toEqual(0)
// Check a full page screenshot
await expect(
await browser.checkFullPageScreen('fullPage', {
/* some options */
})
).toEqual(0)
// Check a full page screenshot with all tab executions
await expect(
await browser.checkTabbablePage('check-tabbable', {
/* some options, use the same options as for checkFullPageScreen */
})
).toEqual(0)
})
})
import { When, Then } from '@wdio/cucumber-framework'
When('I save some screenshots', async function () {
// Save a screen
await browser.saveScreen('examplePage', {
/* some options */
})
// Save an element
await browser.saveElement(await $('#element-id'), 'firstButtonElement', {
/* some options */
})
// Save a full page screenshot
await browser.saveFullPageScreen('fullPage', {
/* some options */
})
// Save a full page screenshot with all tab executions
await browser.saveTabbablePage('save-tabbable', {
/* some options, use the same options as for saveFullPageScreen */
})
})
Then('I should be able to match some screenshots with a baseline', async function () {
// Check screen to exactly match with baseline
await expect(browser).toMatchScreenSnapshot('partialPage')
// check an element to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchScreenSnapshot('partialPage', 5)
// check an element with options for `saveScreen` command
await expect(browser).toMatchScreenSnapshot('partialPage', {
/* some options */
})
// Check an element to exactly match with baseline
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement')
// check an element to have a mismatch percentage of 5% with the baseline
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement', 5)
// check an element with options for `saveElement` command
await expect($('#element-id')).toMatchElementSnapshot('firstButtonElement', {
/* some options */
})
// Check a full page screenshot match with baseline
await expect(browser).toMatchFullPageSnapshot('fullPage')
// Check a full page screenshot to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchFullPageSnapshot('fullPage', 5)
// Check a full page screenshot with options for `checkFullPageScreen` command
await expect(browser).toMatchFullPageSnapshot('fullPage', {
/* some options */
})
// Check a full page screenshot with all tab executions
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable')
// Check a full page screenshot to have a mismatch percentage of 5% with the baseline
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable', 5)
// Check a full page screenshot with options for `checkTabbablePage` command
await expect(browser).toMatchTabbablePageSnapshot('check-tabbable', {
/* some options */
})
})
Then('I should be able to compare some screenshots with a baseline', async function () {
// Check a screen
await expect(
await browser.checkScreen('examplePage', {
/* some options */
})
).toEqual(0)
// Check an element
await expect(
await browser.checkElement(
await $('#element-id'),
'firstButtonElement',
{
/* some options */
}
)
).toEqual(0)
// Check a full page screenshot
await expect(
await browser.checkFullPageScreen('fullPage', {
/* some options */
})
).toEqual(0)
// Check a full page screenshot with all tab executions
await expect(
await browser.checkTabbablePage('check-tabbable', {
/* some options, use the same options as for checkFullPageScreen */
})
).toEqual(0)
})
இந்த சேவை save
மற்றும் check
முறைகளை வழங்குகிறது. நீங்கள் முதல் முறையாக உங்கள் சோதனைகளை இயக்கினால், நீங்கள் save
மற்றும் compare
முறைகளை இணைக்கக்கூடாது, check
-முறைகள் தானாகவே உங்களுக்கு ஒரு அடிப்படை படத்தை உருவாக்கும்
#####################################################################################
INFO:
Autosaved the image to
/Users/wswebcreation/sample/baselineFolder/desktop_chrome/examplePage-chrome-latest-1366x768.png
#####################################################################################
நீங்கள் அடிப்படை படங்களை தானாக சேமிப்பதை முடக்கியிருந்தால், Promise பின்வரும் எச்சரிக்கையுடன் நிராகரிக்கப்படும்.
#####################################################################################
Baseline image not found, save the actual image manually to the baseline.
The image can be found here:
/Users/wswebcreation/sample/.tmp/actual/desktop_chrome/examplePage-chrome-latest-1366x768.png
#####################################################################################
இதன் பொருள் தற்போதைய திரைப்பிடிப்பு actual கோப்புறையில் சேமிக்கப்பட்டுள்ளது மற்றும் நீங்கள் கைமுறையாக அதை உங்கள் அடிப்படைக்கு நகலெடுக்க வேண்டும். நீங்கள் @wdio/visual-service
-ஐ autoSaveBaseline: true
உடன் துவக்கினால், படம் தானாகவே அடிப்படை கோப்புறையில் சேமிக்கப்படும்.