This repository was archived by the owner on Dec 18, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 23
Unauthenticated fetch requests throw Illegal invocation error #443
Copy link
Copy link
Open
Labels
bugSomething isn't workingSomething isn't working
Description
Search terms you've used
fetch, window, invocation error
Bug description
The unauthenticated fetch function causes an error in the useThing hook:
Failed to execute 'fetch' on 'Window': Illegal invocation
(I expect this is a problem for all exposed components
To Reproduce
- setup the sample project at https://docs.inrupt.com/developer-tools/javascript/react-sdk/application/
- Create a custom Test component
- change the /pages/index.jsx file to include the new component instead of the profile view
/pages/index.jsx:
import { useSession } from "@inrupt/solid-ui-react";
import Test from "../components/test";
export default function Home() {
const { session } = useSession();
return (
<div>
<h1>Demo</h1>
<Test />
</div>
);
}
/components/test/index.jsx
import { useState } from "react";
import { useThing } from "@inrupt/solid-ui-react";
import { Container, TextField } from "@material-ui/core";
export default function Test() {
const [value, setValue] = useState('')
const {thing, error} = useThing(value, value)
console.log(thing)
function mapDataset (quads) { return(Array.from(quads).map(q => `s:${q.subject.value}-p:${q.predicate.value}-o:${q.object.value}\n`)) }
return (
<Container fixed>
<TextField value={value} onChange={(e) => setValue(e.target.value)} style={{width: "100%"}}/>
<p>{thing ? mapDataset(thing.quads.values()) : (error ? "Error was thrown" : "Loading ...")}</p>
<p style={{color: 'red'}}>Error: { error && error.message}</p>
</Container>
);
}
Expected result
The Thing object of the currently queries item should be retrieved when it exists
Actual result
The internal fetch function in the useThing() hook fails with the error:
Failed to execute 'fetch' on 'Window': Illegal invocation
Environment
Please run
npx envinfo --system --npmPackages --binaries --npmGlobalPackages --browsers
in your project folder and paste the output here:
$ npx envinfo --system --npmPackages --binaries --npmGlobalPackages --browsers
System:
OS: Linux 5.4 Manjaro Linux
CPU: (4) x64 Intel(R) Core(TM) i5-7440HQ CPU @ 2.80GHz
Memory: 2.71 GB / 15.52 GB
Container: Yes
Shell: 5.1.8 - /bin/bash
Binaries:
Node: 16.7.0 - /usr/bin/node
Yarn: 1.22.11 - /usr/bin/yarn
npm: 7.21.0 - /usr/bin/npm
I got the issues with the packages exactly as in the demo.
I tried updating them afterwards but got some compilation issues for which I currently do not have time :sweat_smile:
Additional information
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working