Route.open does not fire on initial page load if route is matched

[kirillku]

Currenly Route.open will not fire on initial page load even if route is matched. So, Route.open is not reliable at the moment.

This should be possible to achieve

const FriendsRoute = createRoute('/friends')

// Should also load friends if even if user initally opened "/friends" url
// Currenlty will only work when user opened some other url at first and then navigated to "/friends"
sample({
  sourse: FriendsRoute.open,
  target: loadFriendsFx
})

Simplified implementation details (effector playground)

const $pathname = createStore('/')

const open = createEvent()
const close = createEvent()

split({
  source: $pathname,
  match: store => (store ? 'open' : 'close'),
  cases: {open, close},
})

const Route = {open, close}

// Only the code above could be changed. The code below should stay as is.

const fx = createEffect(pathname =>
  console.log(`I should fire with pathname "${pathname}"`)
)

sample({
  source: Route.open,
  target: fx,
})

Locations in code:

• history subscriptions
• Route.open

[kirillku]

Adding watch does not help. Route.open is firing now, but it happens before it used, so does not make any difference.

const $pathname = createStore('/')

const open = createEvent()
const close = createEvent()

const pathnameChanged = createEvent()

split({
  source: pathnameChanged,
  match: store => (store ? 'open' : 'close'),
  cases: {open, close},
})

$pathname.watch(pathnameChanged)
// `Route.open` will fire now.

const Route = {open, close}

// Only the code above could be changed. The code below should stay as is.

const fx = createEffect(pathname =>
  console.log(`I should fire with pathname "${pathname}"`)
)

// sample will still not fire as `Route.open` fired before sample was created.
sample({
  source: Route.open,
  target: fx,
})

[kirillku]

The only solution I see at the moment is to remove Route.open and Route.close and always use Route.match

const FriendsRoute = createRoute('/friends')

guard({
  sourse: FriendsRoute.match,
  filter: FriendsRoute.status,
  target: loadFriendsFx
})

(Worth changing Route.status to Route.matched or Route.isOpen)

[kirillku]

Removing Route.open and Route.close does not really help, as guards are not triggered

const FriendsRoute = createRoute('/friends')

// Will not trigger on initial page load
guard({
  sourse: FriendsRoute.match,
  filter: FriendsRoute.status,
  target: loadFriendsFx
})