Skip to content

Navigating to url with "/:pathVariable" with null unicode symbols causes History.PushState error on route change #47264

@richieforeman

Description

@richieforeman

Which @angular/* package(s) are the source of the bug?

router

Is this a regression?

No

Description

Navigating w/ path matched variables with weird/odd unicode input cause a History.pushState exception.

  • Define a route that has a path-matched param
{ path: 'home/:id', component: HomeViewComponent },
  • Navigate to that path with a very weird Unicode param containing unicode nulls \u0000
    <a routerLinkActive="active" 
       routerLink="/home/\u0000\u0000d\u0000\u0000\u0000\u0000Q\u0000\u0000\u0000\u0000">Break me</a> 
  • Boom, Error!
ERROR Error: Uncaught (in promise): SecurityError: Failed to execute 'pushState' on 'History': A history state object with URL 'https://angular-router-basic-example-w9ecym.stackblitz.io/home/%00%00d%00%00%00%00Q%00%00%00%00' cannot be created in a document with origin 'https://angular-router-basic-example-w9ecym.stackblitz.io' and URL 'https://angular-router-basic-example-w9ecym.stackblitz.io/login'.
Error: Failed to execute 'pushState' on 'History': A history state object with URL 'https://angular-router-basic-example-w9ecym.stackblitz.io/home/%00%00d%00%00%00%00Q%00%00%00%00' cannot be created in a document with origin 'https://angular-router-basic-example-w9ecym.stackblitz.io' and URL 'https://angular-router-basic-example-w9ecym.stackblitz.io/login'.
    at history.pushState (preview-d88182ac6931a.js:2:16857)
    at BrowserPlatformLocation.pushState (browser_platform_location.ts:92:1)
    at PathLocationStrategy.pushState (path_location_strategy.ts:92:1)
    at Location.go (location.ts:107:1)
    at eval (router.ts:727:37)
    at SafeSubscriber.eval [as _next] (Observable.ts:267:11)
    at SafeSubscriber.__tryOrSetError (Subscriber.ts:263:10)
    at SafeSubscriber.next (Subscriber.ts:205:23)
    at Subscriber._next (Subscriber.ts:135:22)
    at Subscriber.next (Subscriber.ts:95:12)
    at resolvePromise (zone.js:770:31)
    at resolvePromise (zone.js:741:17)
    at eval (zone.js:818:17)
    at ZoneDelegate.invokeTask (zone.js:424:31)
    at Object.onInvokeTask (ng_zone.ts:288:1)
    at ZoneDelegate.invokeTask (zone.js:423:36)
    at Zone.runTask (zone.js:191:47)
    at drainMicroTaskQueue (zone.js:584:35)
    at ZoneTask.invoke (zone.js:490:25)

Note, you can dupe this on any webpage, by doing:

history.pushState('blah', 'blah', '\u0000\u0000d)\u0000\u0000\u0000\u0000Q\u0000\u0000\u0000\u0000');

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/angular-router-basic-example-e7nmkh

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Google Internal ref: b/239974353

Anything else?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: router

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions