why history.push produce 2 objects in history stack, react-router-dom

Question

I am using 'react-router-dom' library.

import { useHistory } from 'react-router-dom';

const App = () => {
    window.lib_history = useHistory();

    return /*doesnt matter*/;
}

From console I push some page, but in browser history and in library history 2 object appeared.

/*in console*/

console.log(window.history.length, lib_history.length); // return 11  10 <--it is okay

lib_history.push('/page2'); // redirect successfully

console.log(window.history.length, lib_history.length); // return 13  12 < -- why not 12  11??

And as a main problem - user have to click browser back button 2 times to get previous page. Where should I look for problem?

Answer 1

There was an Iframe in my project which spoiled history stack of whole browser tab. Thanks for hints about setting up history, it was helpful also.