Você quer solicitar um recurso ou relatar um bug ?
Bug-ish
Qual é o comportamento atual?
Ao fazer a renderização do lado do servidor com React, exigir react-dom
(que requer temporariamente ReactDOMFrameScheduling.js
) lança uma exceção porque o rAF não está definido.
Invariant Violation: React depends on requestAnimationFrame. Make sure that you load a polyfill in older browsers.
at invariant (app/node_modules/fbjs/lib/invariant.js:44:15)
at Object.<anonymous> (app/node_modules/react-dom/lib/ReactDOMFrameScheduling.js:30:3)
Isso pode acontecer se você tiver um componente universal com importações de nível superior de bibliotecas do lado do cliente, como react-router-scroll
, que requerem react-dom
vez de react-dom/server
.
Qual é o comportamento esperado?
Eu esperaria não receber esse erro, a menos que requestAnimationFrame fosse realmente chamado. Ex: verifique preguiçosamente o rAF e defina o rIC.
Quais versões do React e quais navegadores / sistemas operacionais são afetados por esse problema?
React 16.0.0-alpha.3 no nó 7.7.1. Isso começou a acontecer em alpha 3, que distribuiu e habilitou o Fiber.
Uma solução alternativa que atinge meu comportamento esperado é que cada consumidor do React defina um pequeno polyfill em um arquivo que é importado antes dos outros, mas espero que muitas pessoas encontrem esse problema. Isto é o que parece:
global.window = global;
window.addEventListener = () => {};
window.requestAnimationFrame = () => {
throw new Error('requestAnimationFrame is not supported in Node');
};
Poderíamos corrigir isso inicializando preguiçosamente rAF
polyfill, mas agora que penso nisso, parece lamentável que simplesmente importar findDOMNode
(que é provavelmente o que os componentes fazem) executa todo o código de inicialização do reconciliador de cliente .
@gaearon Não deveria ter sido detectado no teste de unidade
Além disso, mais importante, não é exigir react-dom
e executar findDOMNode
no servidor um anti-padrão, e os componentes devem evitá-los em ganchos executados no servidor?
Além disso, o mais importante é que exigir o react-dom e executar findDOMNode no servidor não é um anti-padrão, e os componentes devem evitá-los em ganchos executados no servidor?
Você não deve executá-lo no servidor, mas pode importá-lo. Caso contrário, como você escreveria um componente que usa findDOMNode
no cliente, mas ainda funciona no servidor?
Não deveria ter sido detectado no teste de unidade
Não, o teste não detecta isso porque configuramos um polyfill rAF global como parte de nosso ambiente de teste.
Edit: O PR é apenas para ilustração. Apenas executei os testes de unidade. Sem fiapos e corrida mais bonita ainda.
Abriu um PR para colocar a ideia em código.
Mudei o cheque de rAF
dentro do ReactFiberScheduler
Mas agora, perdi a capacidade de lançar se rAF
não for polyfilled. Este é o lugar certo para a verificação preguiçosa que você mencionou?
Comentários muito úteis
Uma solução alternativa que atinge meu comportamento esperado é que cada consumidor do React defina um pequeno polyfill em um arquivo que é importado antes dos outros, mas espero que muitas pessoas encontrem esse problema. Isto é o que parece: