georgecrawford/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
    <title>Webdriverio Testpage</title>
</head>
<body>

    <header>
        <h1>Webdriverio Testpage</h1>
    </header>

    <section class="page">
        <div style="background:silver;">
            <h2>staleElementTests</h2>
            <h3>Test 1</h3>
            <ul class="staleElementContainer1"></ul>
            <h3>Test 2</h3>
            <ul class="staleElementContainer2"></ul>
        </div>

        <script>
            function addRow(container, count) {
                var newRow = document.createElement('li');
                newRow.classList.add('stale-element-container-row');
                newRow.classList.add('stale-element-container-row-' + count);
                newRow.innerHTML = count;
                container.appendChild(newRow);
                return newRow;
            }

            function removeRow(row) {
                if (row) row.parentNode.removeChild(row);
            }

            function staleElementTest1() {
                var container = document.querySelector('.staleElementContainer1');

                var count = 0;
                var lastRow;

                function loop() {
                    count++;
                    removeRow(lastRow);
                    lastRow = addRow(container, count);
                }

                setInterval(loop, 200);
            }

            function staleElementTest2() {
                var container = document.querySelector('.staleElementContainer2');

                var timeout = 200;
                for (var i = 1; i <= 40; i++) {
                    timeout += 311;
                    var row = addRow(container, i);
                    setTimeout(removeRow.bind(null, row), timeout);
                }
            }

            staleElementTest1();
            staleElementTest2();

        </script>
    </section>
</body>
</html>

## staleElementRetry.js
/* global browser */
'use strict';

var chai   = require('chai');
var assert = chai.assert;
var expect = chai.expect;

describe('staleElementRetry', function() {

    beforeEach(function() {
        browser.url('/tests/www/');
        browser.pause(500);
    });

    it('does not throw staleElementReference exception when getting visibility of elements rapidly removed from DOM', function() {
        var iterations = 100;
        while (iterations--) {
            expect(browser.isVisible('.staleElementContainer1 .stale-element-container-row')).to.be.true;
        }
    });

    it('does not throw staleElementReference exception when waiting for element to become invisible but which is removed from DOM in a custom command', function() {

        browser.addCommand('waitForVisibleInParallel', function async() {
            var promises = [];
            var start = Date.now();
            for (var i = 1; i <= 8; i++) {
                promises.push(browser.waitForVisible('.staleElementContainer2 .stale-element-container-row-' + i, 10000, true));
            }

            return Promise.all(promises)
            .then(function(results) {
                console.log('Promise.all() complete', (Date.now() - start))
                results.map(function(result) {
                    expect(result).to.be.true;
                });
            });
        });

        browser.waitForVisibleInParallel();
    });

});

## wdio.conf.js
exports.config = {
    baseUrl: 'http://127.0.0.1:9000',
    testPage: {
        start: 'http://127.0.0.1:9000/test/site/www/index.html',
    },
    host: 'localhost',
    port: 4444,
    path: undefined,
    logLevel: 'log',
    waitforTimeout: 1000,
    capabilities: [
        {
            browserName: 'chrome'
        }
    ],
    framework: 'mocha',
    specs: ['tests/**.js'],
    mochaOpts: {
        ui: 'bdd',
        timeout: 100000
    },


};
	<!DOCTYPE html>
	<html>
	<head>
	<title>Webdriverio Testpage</title>
	</head>
	<body>

	<header>
	<h1>Webdriverio Testpage</h1>
	</header>

	<section class="page">
	<div style="background:silver;">
	<h2>staleElementTests</h2>
	<h3>Test 1</h3>
	<ul class="staleElementContainer1"></ul>
	<h3>Test 2</h3>
	<ul class="staleElementContainer2"></ul>
	</div>

	<script>
	function addRow(container, count) {
	var newRow = document.createElement('li');
	newRow.classList.add('stale-element-container-row');
	newRow.classList.add('stale-element-container-row-' + count);
	newRow.innerHTML = count;
	container.appendChild(newRow);
	return newRow;
	}

	function removeRow(row) {
	if (row) row.parentNode.removeChild(row);
	}

	function staleElementTest1() {
	var container = document.querySelector('.staleElementContainer1');

	var count = 0;
	var lastRow;

	function loop() {
	count++;
	removeRow(lastRow);
	lastRow = addRow(container, count);
	}

	setInterval(loop, 200);
	}

	function staleElementTest2() {
	var container = document.querySelector('.staleElementContainer2');

	var timeout = 200;
	for (var i = 1; i <= 40; i++) {
	timeout += 311;
	var row = addRow(container, i);
	setTimeout(removeRow.bind(null, row), timeout);
	}
	}

	staleElementTest1();
	staleElementTest2();

	</script>
	</section>
	</body>
	</html>
	/* global browser */
	'use strict';

	var chai = require('chai');
	var assert = chai.assert;
	var expect = chai.expect;

	describe('staleElementRetry', function() {

	beforeEach(function() {
	browser.url('/tests/www/');
	browser.pause(500);
	});

	it('does not throw staleElementReference exception when getting visibility of elements rapidly removed from DOM', function() {
	var iterations = 100;
	while (iterations--) {
	expect(browser.isVisible('.staleElementContainer1 .stale-element-container-row')).to.be.true;
	}
	});

	it('does not throw staleElementReference exception when waiting for element to become invisible but which is removed from DOM in a custom command', function() {

	browser.addCommand('waitForVisibleInParallel', function async() {
	var promises = [];
	var start = Date.now();
	for (var i = 1; i <= 8; i++) {
	promises.push(browser.waitForVisible('.staleElementContainer2 .stale-element-container-row-' + i, 10000, true));
	}

	return Promise.all(promises)
	.then(function(results) {
	console.log('Promise.all() complete', (Date.now() - start))
	results.map(function(result) {
	expect(result).to.be.true;
	});
	});
	});

	browser.waitForVisibleInParallel();
	});

	});
	exports.config = {
	baseUrl: 'http://127.0.0.1:9000',
	testPage: {
	start: 'http://127.0.0.1:9000/test/site/www/index.html',
	},
	host: 'localhost',
	port: 4444,
	path: undefined,
	logLevel: 'log',
	waitforTimeout: 1000,
	capabilities: [
	{
	browserName: 'chrome'
	}
	],
	framework: 'mocha',
	specs: ['tests/**.js'],
	mochaOpts: {
	ui: 'bdd',
	timeout: 100000
	},


	};