RouterEventType is no longer exported? about pico-router

[aigr]

But other things have changed as well.

If I have something like

nav.path('/browse/:cname', (req, res) => {
  const sub = nav.events.subscribe(event => {
    // if (event.type === RouterEventType.ProgressEnd) {
    if (event.type === 'ROUTER_END') {
      res.mount(Collection, { req, nav })
    }
  })
  res.onLeave(() => sub.unsubscribe())
})

Then previously a call to nav.navigate('/browse/foo'), while "being" on '/browse/bar' worked out. Now I need to click links twice for it to flip.

[aigr]

A work-around might be to do

if (event.type === 'ROUTER_END') {

Instead of

if (event.type === RouterEventType.ProgressEnd) {

[alshdavid]

Hey thanks for your issue.
I'm releasing an update now to re-expose the RouterEventType.

Going to try to recreate your second issue to see what's going on there

[alshdavid]

Export should work as of version 4.1.5
Will need to investigate further on your other issue

[aigr]

Hmm. Perhaps I'm doing something wrong, but it doesn't seem to work for me

$ jq  '.dependencies.crayon.version' package-lock.json
"4.1.5"

And then

$ npm run build
...
[!] Error: 'RouterEventType' is not exported by node_modules/crayon/dist/index.js
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
svelte/main.js (3:17)
3: import crayon, { RouterEventType } from 'crayon'
                    ^
Error: 'RouterEventType' is not exported by node_modules/crayon/dist/index.js

[alshdavid]

It seems good here:

JavaScript:
https://stackblitz.com/edit/typescript-akyrxk

TypeScript:
https://stackblitz.com/edit/js-7yh9tp

Did you try uninstalling/installing it again?

npm uninstall --save crayon
npm install -save crayon

[alshdavid]

I have added the following test to the latest current version:

it('Should ', async (done) => {
  const window = new MockWindow() as any
  const app = create('test-router', window)
  let hasClicked = false

  app.path('/browse/:cname', (req, res) => {
    const sub = app.events.subscribe(async event => {
      if (event.type !== RouterEventType.ProgressEnd) {
        return
      }
      if (hasClicked == true) {
        done()
        return
      }
      hasClicked = true
      await app.navigate('/browse/b')
    })
    res.onLeave(() => sub.unsubscribe())
  })

  await app.load()
  await app.navigate('/browse/a')
})

Does that cover your use case? If not, could you set up a code sandbox illustrating your case?

[aigr]

Still doesn't work for me locally, but that must surely be some kind of mistake on my part. It seems to work out well elsewhere. 😄

W.r.t to my second problems, where links have to pressed twice to change, I've made a minimalistic example of it at https://codesandbox.io/s/sweet-taussig-2q3wb.

You go "Home", press "foo", then keep pressing the links for "next".

(I've somehow messed up the transitions, but that's another story)

[alshdavid]

Thanks for taking the time to put together that sandbox! I'm working on it now.

[alshdavid]

Just a quick update on this.

app.events.subscribe(event => {
  if (event.type !== "ROUTER_END") {
    return
  }
  console.log(window.location.pathname)
  console.log(req.params.name) 
});

req.params.name lags behind window.location.pathname
So It seems like I'm not updating the request at the right time.

Looks like the RouterEventType value is available in TypeScript, but not in JavaScript. Looking into that too.

[alshdavid]

RouterEventType is now exported on the default crayon export

You can check out this sandbox
https://codesandbox.io/s/svelte-khjjw?fontsize=14&hidenavigation=1&theme=dark

I'll be enhancing the documentation soon, but for now to access RouterEventType do the following:

import crayon from 'crayon'

console.log(crayon.RouterEventType.ProgressStart)

Let me know if you have any issues, otherwise I'll close this issue for now