Suspense is not resolved and the requests are looping

import React, { Suspense } from 'react';
import useSWR from '@zeit/swr'

function StarWarsSuspense() {
  return (
    <Suspense fallback={<div>loading ...</div>}>
      <StarWars />
    </Suspense>
  )
}

function StarWars() {
  const { data } = useSWR('http://swquotesapi.digitaljedi.dk/api/SWQuote/RandomStarWarsQuote', fetch, { suspense: true });

  return (
    <div>
      {data.starWarsQuote}
    </div>
  );
}

export default StarWarsSuspense;

With this code, i never get the final component, the placeholder stay forever, looking on chrome developer console, the requests are looping.

I made this code using the readme example, i tried change de fetch function to a random promise to see if i get out of fallback, without no results.

I doing something wrong or this is really something that should not happen ?

[shuding]

@erikjung sorry that PR wasn’t included in 0.1.2.
Updating to swr@0.1.5 will fix it:

https://codesandbox.io/s/swr-playground-946db

[erikjung]

I also get the same outcome: https://codesandbox.io/s/lucid-field-kbz20

Not sure if the suspense option is intended for the existing suspense feature in React stable or for the new concurrent functionality of react@experimental. Tried both approaches with both versions of React and got the same results.

Also unclear if anything special is required for the fetch function implementation. The docs imply that passing the global fetch function directly should work, but this basic example is wrapping fetch to resolve the .json() promise as well. 🤷‍♂️