Jsdom: Riwayat browser pushState/onpopstate/window.location tidak dikelola dengan baik

Dibuat pada 17 Jul 2016 · 4Komentar · Sumber: jsdom/jsdom

Halo,

Saya akan mengatakan manajemen sejarah tidak lengkap.
Tes ini di pihak saya gagal dengan jsdom versi 9.4.1:

    describe('jsdom history management', () => {
        before(() => {
        // Init DOM with a fake document
        // <base> and uri (initial uri) allow to do pushState in jsdom
            jsdom.env({
                html: `
                 <html>
                     <head>
                         <base href="http://localhost:8080/"></base>
                     </head>
                  </html>
                `,
                url: 'http://localhost:8080/',
                done(err, window) {
                    global.window = window;
                    global.document = window.document;
                    window.console = global.console;
                }
            });
        });

        it('location not updated', () => {
            window.history.pushState({}, 'route1', '/route1');
            assert(window.location.pathname === '/route1'); // this test is OK
            window.history.back();
            assert(window.location.pathname === '/'); // this test fails pathname still with value '/route1'
        });

        it('onpopstate not called', () => {
            window.onpopstate = () => { };
            const spy_onpopstate = sinon.spy(window, 'onpopstate');
            window.history.pushState({}, 'route1', '/route1');
            window.history.back();
            window.history.forward();
            assert(spy_onpopstate.called);// this test fails as well
        });
    });

Sumber

camelaissani

👍9

Komentar yang paling membantu

Sebuah solusi, bagi siapa saja yang menemukan posting ini dan ingin mendapatkan tes bekerja, menggunakan Sinon spy dan mengejek metode history.pushState atau history.replaceState .

crobinson42 pada 28 Apr 2017

👍7

Semua 4 komentar

Ya. jsdom secara umum belum mendukung navigasi, karena itu melibatkan pembuatan objek jendela yang sama sekali baru. Ini adalah masalah jangka panjang yang sulit dan kami belum mulai berpikir untuk mengatasinya.

domenic pada 17 Jul 2016

Sebuah solusi, bagi siapa saja yang menemukan posting ini dan ingin mendapatkan tes bekerja, menggunakan Sinon spy dan mengejek metode history.pushState atau history.replaceState .

crobinson42 pada 28 Apr 2017

👍7

@crobinson42 tidak yakin apakah saya mengerti Anda, tetapi apakah mengejek akan membantu dengan window.onpopstate juga?

gaurav5430 pada 18 Des 2017

Inilah solusi yang saya gunakan (TypeScript):

function firePopstateOnRoute(window: DOMWindow): void {
  const { history } = window;
  const originalBack = history.back;
  const originalForwards = history.forward;

  (history as unknown as {__proto__: History})['__proto__'].back = function patchedBack(this: History, ...args: Parameters<History['back']>): void {
    originalBack.apply(this, args);

    window.dispatchEvent(new PopStateEvent('popstate'));
  };

  (history as unknown as {__proto__: History}).__proto__.forward = function patchedForward(this: History, ...args: Parameters<History['forward']>): void {
    originalForwards.apply(this, args);

    window.dispatchEvent(new PopStateEvent('popstate'));
  };
}

export function mockBrowser(): void {
  const jsdom = new JSDOM('');
  const { window } = jsdom;

  firePopstateOnRoute(window);
}