{"action":"created","issue":{"url":"https://api.github.com/repos/mozilla/pdf.js/issues/10380","repository_url":"https://api.github.com/repos/mozilla/pdf.js","labels_url":"https://api.github.com/repos/mozilla/pdf.js/issues/10380/labels{/name}","comments_url":"https://api.github.com/repos/mozilla/pdf.js/issues/10380/comments","events_url":"https://api.github.com/repos/mozilla/pdf.js/issues/10380/events","html_url":"https://github.com/mozilla/pdf.js/issues/10380","id":393898882,"node_id":"MDU6SXNzdWUzOTM4OTg4ODI=","number":10380,"title":"Can't change/jump to page","user":{"login":"RudmanMario","id":6641653,"node_id":"MDQ6VXNlcjY2NDE2NTM=","avatar_url":"https://avatars0.githubusercontent.com/u/6641653?v=4","gravatar_id":"","url":"https://api.github.com/users/RudmanMario","html_url":"https://github.com/RudmanMario","followers_url":"https://api.github.com/users/RudmanMario/followers","following_url":"https://api.github.com/users/RudmanMario/following{/other_user}","gists_url":"https://api.github.com/users/RudmanMario/gists{/gist_id}","starred_url":"https://api.github.com/users/RudmanMario/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/RudmanMario/subscriptions","organizations_url":"https://api.github.com/users/RudmanMario/orgs","repos_url":"https://api.github.com/users/RudmanMario/repos","events_url":"https://api.github.com/users/RudmanMario/events{/privacy}","received_events_url":"https://api.github.com/users/RudmanMario/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":3,"created_at":"2018-12-24T15:24:22Z","updated_at":"2018-12-27T11:45:11Z","closed_at":"2018-12-25T14:26:02Z","author_association":"NONE","body":"I'm using this library with React to render the whole pdf document and also have the function to go to particular page. The strange thing is that I can't jump to page only when I'm rendering my whole document with `new pdfjsViewer.PDFViewer` , but when I'm using `new pdfjsViewer.PDFSinglePageViewer` for rendering just one page at the time I can normally jump to page and implement all other functions.\r\n\r\nThis is some of my code:\r\n```\r\nimport * as pdfWorker from 'pdfjs-dist/build/pdf.worker'\r\nimport PdfJsLib from 'pdfjs-dist';\r\nimport 'pdfjs-dist/web/pdf_viewer.css';\r\nimport * as pdfjsViewer from 'pdfjs-dist/web/pdf_viewer';\r\n\r\n...\r\n\r\ncomponentDidMount() {\r\n        let container = this.viewerContainer.current;\r\n        let viewer = this.viewer.current;\r\n\r\n        PdfJsLib.GlobalWorkerOptions.workerSrc = pdfWorker;\r\n        PdfJsLib.getDocument(this.props.file).then((pdf) => {\r\n\r\n            this.setState({numPages: pdf.numPages});\r\n\r\n            this.pdfLinkService = new pdfjsViewer.PDFLinkService();\r\n\r\n            this.pdfFindController = new pdfjsViewer.PDFFindController({\r\n                linkService: this.pdfLinkService,\r\n            });\r\n\r\n            this.pdfViewer = new pdfjsViewer.PDFViewer({\r\n                 container,\r\n                 viewer,\r\n                 linkService: this.pdfLinkService,\r\n                 findController: this.pdfFindController\r\n            });\r\n            this.pdfLinkService.setViewer(this.pdfViewer);\r\n\r\n            this.pdfViewer.setDocument(pdf);\r\n            this.pdfLinkService.setDocument(pdf, null);\r\n\r\n            this.pdfViewer.onePageRendered.then(() => {\r\n                 pdf.getOutline().then((outline) => {\r\n                     this.outline = outline || null;\r\n\r\n                     if (!outline) {\r\n                        return;\r\n                     }\r\n                     this.setState({bookmarkItems: outline});\r\n            });\r\n       });\r\n   });\r\n}\r\n\r\n\r\n\r\n...\r\n\r\nonNextPageClick = () => {\r\n    if(this.state.numPages > this.state.pageNumber) {\r\n        this.setState({pageNumber: this.state.pageNumber + 1});\r\n        this.setState({pageNumberInput: this.state.pageNumber + 1});\r\n\r\n        this.pdfViewer.currentPageNumber++;\r\n    }\r\n}\r\nonPreviousPageClick = () => {\r\n    if(this.state.pageNumber > 1) {\r\n        this.setState({pageNumber: this.state.pageNumber - 1});\r\n        this.setState({pageNumberInput: this.state.pageNumber - 1});\r\n\r\n        this.pdfViewer.currentPageNumber--;\r\n    }\r\n}\r\n\r\n...\r\n\r\nrender() {\r\n    return(\r\n\r\n        ...\r\n\r\n        <div className=\"splitToolbarButton hiddenSmallView\">\r\n            <button className=\"toolbarButton pageUp\" title=\"Previous Page\" id=\"previous\" tabIndex=\"13\" data-l10n-id=\"previous\" onClick={this.onPreviousPageClick}>\r\n            <span data-l10n-id=\"previous_label\">Previous</span>\r\n            </button>\r\n         <div className=\"splitToolbarButtonSeparator\" />\r\n            <button className=\"toolbarButton pageDown\" title=\"Next Page\" id=\"next\" tabIndex=\"14\" data-l10n-id=\"next\" onClick={this.onNextPageClick}>\r\n             <span data-l10n-id=\"next_label\">Next</span>\r\n            </button>\r\n        </div>\r\n\r\n         ...\r\n\r\n        <div id=\"viewerContainer\" ref={this.viewerContainer}>\r\n            <div id=\"viewer\" ref={this.viewer} className=\"pdfViewer\" />\r\n        </div>\r\n    )\r\n}\r\n```\r\nIs there anything that I'm doing wrong here or am I missing something?\r\n\r\nConfiguration:\r\n- Web browser and its version: Chrome 71.0.3578.98 \r\n- Operating system and its version: Windows 10\r\n- PDF.js version: 2.0.489\r\n"},"comment":{"url":"https://api.github.com/repos/mozilla/pdf.js/issues/comments/450136057","html_url":"https://github.com/mozilla/pdf.js/issues/10380#issuecomment-450136057","issue_url":"https://api.github.com/repos/mozilla/pdf.js/issues/10380","id":450136057,"node_id":"MDEyOklzc3VlQ29tbWVudDQ1MDEzNjA1Nw==","user":{"login":"RudmanMario","id":6641653,"node_id":"MDQ6VXNlcjY2NDE2NTM=","avatar_url":"https://avatars0.githubusercontent.com/u/6641653?v=4","gravatar_id":"","url":"https://api.github.com/users/RudmanMario","html_url":"https://github.com/RudmanMario","followers_url":"https://api.github.com/users/RudmanMario/followers","following_url":"https://api.github.com/users/RudmanMario/following{/other_user}","gists_url":"https://api.github.com/users/RudmanMario/gists{/gist_id}","starred_url":"https://api.github.com/users/RudmanMario/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/RudmanMario/subscriptions","organizations_url":"https://api.github.com/users/RudmanMario/orgs","repos_url":"https://api.github.com/users/RudmanMario/repos","events_url":"https://api.github.com/users/RudmanMario/events{/privacy}","received_events_url":"https://api.github.com/users/RudmanMario/received_events","type":"User","site_admin":false},"created_at":"2018-12-27T11:45:11Z","updated_at":"2018-12-27T11:45:11Z","author_association":"NONE","body":"I found where my problem was. I wasn't aware that `div` element with id `viewerContainer` has to have `position: absolute` so that `scrollIntoView` actually do something. The same goes for the `div` element `mainContainer`. Of course it make sense now but I was looking at the wrong places all the time thinking it has to do something with react or services like `PDFLinkService.` @timvandermeij Thank you for the help."}}
{"actor":{"display_login":"RudmanMario"}}