Skip to content

In React -Reveal.destroy() → Error: Cannot read properties of undefined (reading 'forEach') #3593

@brandontrew

Description

@brandontrew

Error: when trying to destroy() the reveal instance within React (per documentation)

Reveal.js destroy call failed. TypeError: Cannot read properties of undefined (reading 'forEach')
    at eval (reveal.esm.js:8:61023)
    at Array.forEach (<anonymous>)
    at M.unbind (reveal.esm.js:8:60987)
    at Se (reveal.esm.js:8:83644)
    at Object.destroy (reveal.esm.js:8:100765)
    at eval (RevealApp.jsx:95:31)
    at safelyCallDestroy (react-dom.development.js:22932:1)
    at commitHookEffectListUnmount (react-dom.development.js:23100:1)
    at invokePassiveEffectUnmountInDEV (react-dom.development.js:25207:1)
    at invokeEffectsInDev (react-dom.development.js:27351:1)

Initialize & Return, per https://revealjs.com/react/

  useEffect(() => { 
      if (revealRef.current) return;
      let resizeObserver;

      revealRef.current = new Reveal(revealInitDivRef.current, RevealConfig);
      revealRef.current.initialize().then(() => {

        revealRef.current.addEventListener('drop', handleFileDrop);
        revealRef.current.on( 'slidechanged', event => {
          handleSlideChange(event)
        });
        revealRef.current.on('resize', event => {
          if (revealRef.current) {
            revealRef.current.sync();
            revealRef.current.layout();
          }
        });

        resizeObserver = new ResizeObserver(() => {
          if (revealRef.current) {
            revealRef.current.sync();
            revealRef.current.layout();
          }
        });
        if (revealElement) resizeObserver.observe(revealElement);

        revealRef.current.sync();
        revealRef.current.layout();
        setRevealInitialized(true);

      })
      .catch(error => {
        console.error("Failed to initialize editor:", error);
      });

      return () => {
        try {
          if (revealRef.current) {
            console.log('revealRef.current',revealRef.current);
            revealRef.current.destroy();
            revealRef.current = null;
          }
        } catch (e) {
          console.warn("Reveal.js destroy call failed.", e);
        }
      };

    }, []);

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions