siesta-lite/tests/recorder/target_extractor/006_plain_html.t.js

Stress-free JavaScript unit testing and functional testing tool, works in NodeJS and browsers

StartTest(function (t) {

    t.describe('Label field click (triggers extra click)', function (t) {
        document.body.innerHTML = '<label id="lab" for="foo" oncontextmenu="return false">BAR</label><input id="foo">'

        var recorder = new Siesta.Recorder.ExtJS({ ignoreSynthetic : false });

        recorder.attach(window);

        t.it('click', function (t) {
            recorder.clear();
            recorder.start();

            t.click('#lab', function () {
                var actions = recorder.getRecordedActions();

                t.is(actions.length, 1);
                t.is(actions[0].action, 'click');
                t.isDeeply(actions[0].getTarget(), { type : 'css', target : '#lab' });

                recorder.stop();
            });
        })

        t.it('right click', function (t) {
            recorder.clear();
            recorder.start();

            t.rightClick('#lab', function () {
                var actions = recorder.getRecordedActions();

                t.is(actions.length, 1);
                t.is(actions[0].action, 'contextmenu');
                t.isDeeply(actions[0].getTarget(), { type : 'css', target : '#lab', offset : t.any() });

                recorder.stop();
            });
        });

        t.it('double click', function (t) {
            recorder.clear();
            recorder.start();

            t.doubleClick('#lab', function () {
                var actions = recorder.getRecordedActions();

                t.is(actions.length, 1);
                t.is(actions[0].action, 'dblclick');
                t.isDeeply(actions[0].getTarget(), { type : 'css', target : '#lab' });

                recorder.stop();
                recorder.clear();
            });
        })
    })


    t.describe('Should record text content of A tag', function (t) {
        var recorder = new Siesta.Recorder.ExtJS({ ignoreSynthetic : false });

        recorder.attach(window);

        t.it('simple click', function (t) {
            document.body.innerHTML = '<a>BAR</a><a>BAZ</a>'

            recorder.clear();
            recorder.start();

            t.click(':textEquals(BAR)', function () {
                var actions = recorder.getRecordedActions();

                t.is(actions.length, 1);
                t.is(actions[0].action, 'click');
                t.isDeeply(actions[0].getTarget(), { type : 'css', target : ':textEquals(BAR)' });

                recorder.stop();
            });
        })

        t.it('ignore if A tag contains markup', function (t) {
            document.body.innerHTML = '<a><span>QUIX LONG</span></a><span></span>'

            recorder.clear();
            recorder.start();

            t.chain(
                { click : 'a:contains(QUIX LONG)' },

                function (next) {
                    var actions = recorder.getRecordedActions();

                    t.is(actions.length, 1);
                    t.is(actions[0].action, 'click');
                    t.is(actions[0].getTarget().target, 'span:textEquals(QUIX LONG)');
                    t.is(actions[0].getTarget().type, 'css');

                    recorder.stop();
                }
            );
        })
    })

    t.describe('Should support configuring which unique attribute to prioritize', function (t) {
        document.body.innerHTML = '<div id="foo"><span id="DONT_USE" other_id="USE_ME">Hello</span></div>'
        document.body.innerHTML += '<div other_id="someId"><span class="cls">Hello</span></div>'

        var recorder = new Siesta.Recorder.ExtJS({
            extractorConfig : {
                uniqueDomNodeProperty : 'other_id'
            },
            ignoreSynthetic : false
        });

        recorder.attach(window);
        recorder.start();

        t.chain(
            { click : '#DONT_USE' },

            function (next) {
                var actions = recorder.getRecordedActions();

                t.is(actions.length, 1);
                t.is(actions[0].action, 'click');
                t.isDeeply(actions[0].getTarget(), {
                    type   : 'css',
                    target : "[other_id='USE_ME']"
                });

                recorder.stop();
                recorder.clear();
                recorder.start();

                next()
            },

            { click : '.cls' },

            function (next) {
                var actions = recorder.getRecordedActions();

                t.is(actions.length, 1);
                t.is(actions[0].action, 'click');
                t.isDeeply(actions[0].getTarget(), {
                    type   : 'css',
                    target : "[other_id='someId'] .cls"
                });

                recorder.stop();
            }
        )
    })


    t.describe('Should support `shouldIgnoreDomElementId` config', function (t) {
        document.body.innerHTML = '<div id="foo"><span id="DONT_USE">Hello</span></div>'

        var recorder = new Siesta.Recorder.ExtJS({
            shouldIgnoreDomElementId    : function (id, el) {
                return id == "DONT_USE"
            },
            ignoreSynthetic             : false
        });

        recorder.attach(window);
        recorder.start();

        t.click('#DONT_USE', function () {
            var actions = recorder.getRecordedActions();

            t.is(actions.length, 1);
            t.is(actions[ 0 ].action, 'click');
            t.isDeeply(actions[ 0 ].getTarget(), {
                type   : 'css',
                target : "#foo :textEquals(Hello)"
            });

            recorder.stop();
        });
    })


    t.describe('Should use "name" attribute', function (t) {
        document.body.innerHTML = ' \
            <form method="post" action="index.html"> \
                <p><input type="text" name="user"></p> \
                <p><input type="password" name="password"></p> \
            </form>';

        var recorder = new Siesta.Recorder.ExtJS({
            recordOffsets : false,
            ignoreSynthetic : false
        });

        recorder.attach(window);
        recorder.start();

        t.chain(
            { click : "[name='user']" },
            { click : "[name='password']" },

            function () {
                recorder.stop();

                var actions = recorder.getRecordedActions();

                t.is(actions.length, 2);
                t.is(actions[0].action, 'click');
                t.isDeeply(actions[0].getTarget(), {
                    type   : 'css',
                    target : "[name='user']"
                });

                t.is(actions[1].action, 'click');
                t.isDeeply(actions[1].getTarget(), {
                    type   : 'css',
                    target : "[name='password']"
                });
            }
        )
    })
})