Skip to content

Uncaught Error: Missing Subscribe #265

Description

@SerkanSipahi

Unfortunately, I don't know what to do because I am very new to the React world and have only worked with Angular until now. Unfortunately, I cannot assign this error. What does "Missing Subscribe" mean? Do I have to subscribe to it myself? If so, what steps are missing here? I have orientated myself on the tests and also on the React page how to build custom hooks.

Sources:
https://github.com/re-rxjs/react-rxjs/blob/main/packages/core/src/bind/connectObservable.test.tsx
https://react-rxjs.org/docs/api/core/bind
https://reactjs.org/docs/hooks-custom.html

Where are my misconceptions of using of react-rxjs?

log://error

Error
Missing Subscribe!
Call Stack
 gv
  vendor.js:1142:15
 mountSyncExternalStore
  vendor.js:23762:20
 Object.useSyncExternalStore
  vendor.js:24701:14
 useSyncExternalStore
  vendor.js:40731:21
 useStateObservable
  vendor.js:1175:101
 useStaticObservable
  vendor.js:1190:37
 App
  main.js:102:30
 renderWithHooks
  vendor.js:23268:18
 mountIndeterminateComponent
  vendor.js:27960:13
 beginWork
  vendor.js:29464:16

file://main.tsx

root.render(
  <StrictMode>
    <App />
  </StrictMode>,
);

file://app.tsx

export function App() {
  const element = useWatchSelector('video', 0, 250);
  return <div>{radarElement ? 'Found' : 'notFound'}</div>;;
}

file:// use-watch-selector.ts

import { bind } from '@react-rxjs/core';
import { watchSelector } from './radar.observable';
import { useEffect, useState } from 'react';

export function useWatchSelector<Element extends HTMLElement>(
  selector: string,
  startWithInterval = 0,
  interval = 250,
  context: Document | HTMLElement = document,
) {
  const [watchElement, setWatchElement] = useState<Element | null>(null);
  const [useBindValue] = bind(
    watchSelector<Element>(selector, context, interval, startWithInterval), // Obervable<HTMLElement>
  );

  const watchSelectorValue = useBindValue();
  useEffect(() => setWatchElement(watchSelectorValue), [watchSelectorValue]);

  return watchElement;
}

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions