Is there a way to customize the "instanceof" functionality for an ArrayBuffer?

I've been working on a project that involves using threejs to draw a filled polygon based on its vertices. Initially, I started with a square and was able to get it working perfectly on its own. However, the real issue arose when I tried to integrate this geometry into my main project, which utilizes third-party libraries also using threejs. One of the libraries runs a check

array.buffer instanceof ArrayBuffer
which should return true, but strangely it returns false even though I have confirmed it as true after creation. Even in debugging, the ArrayBuffer does not seem detached, indicating that something is causing the inheritance chain to break.

Given the uncertainty of where this inheritance break is happening, my only solution that comes to mind is to provide a buffer from my custom class that extends ArrayBuffer and overrides the instanceof method.

Drawing inspiration from this inheritance example

class Float32ArrayBuffer extends ArrayBuffer {
    static [Symbol.hasInstance](instance: any) {
        var regularCheck = this instanceof instance;
        console.log('asdffdsa')
        console.log(instance)
        return regularCheck; 
    }
}

Unfortunately, the function within this class never seems to execute. Even with a breakpoint before the instanceof check, it correctly shows my type. I'm not sure if there's an alternative approach to overriding this behavior or if there's a way to address the root cause of the issue. Any assistance would be greatly appreciated. Thank you

Answer №1

Running your application through NW.js? Be cautious of its peculiar approach to object contexts in mixed Node / V8 environments, where myValue instanceof myConstructor may actually return false inaccurately. I've encountered issues with Three.js GLTF loaders due to this behavior.

One potential fix is to add

"chromium-args": "--mixed-context"
to your package.json file as suggested in this resource. While this may make variable sharing more challenging, it has personally not caused any significant problems for me.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Containerizing Next.js with TypeScript

Attempting to create a Docker Image of my Nextjs frontend (React) application for production, but encountering issues with TypeScript integration. Here is the Dockerfile: FROM node:14-alpine3.14 as deps RUN apk add --no-cache tini ENTRYPOINT ["/sbin ...

Encountering an issue while developing a Discord bot using TypeScript

Hello, I'm currently working on creating a nick command for my discord bot in TypeScript, but I encountered an error. Here is the issue: Error: Expression expected.ts (1109) When I replace const mentionedMember = message? message.mentions.members? ...

Performing an HTTP POST request in Angular 2

After starting my work with Angular 2 and TypeScript, everything was going great. However, I encountered an issue when working with a REST API (POST) where the console log displayed Response {_body: "", status: 204, statusText: "Ok", headers: Headers, type ...

How can I display table rows along with their child table rows in Angular?

Is there a way to display API data in a table using Angular? The table should have collapsible rows with nested child rows. This is the JSON file structure: { "collapse1": [ { "name": "Soil", "budget": 12345, "child": [ { ...

Controlling the visibility of components or elements in Angular through input modifications

Is there a more efficient way to handle button disabling and enabling based on email validation in Angular? I already have form controls set up, but want to make the process cleaner. The goal is to disable the "Get Started" button by default if the email a ...

What is the best way to create a universal limitation for a larger collection of a discriminated union?

Is it possible to enforce that when defining a generic class Foo<X>, where X represents a discriminated union type, X must be a superset of another discriminated union Y? In my specific scenario, I am utilizing a discriminated union to differentiate ...

What is the reason that {a: never} is not the same as never?

Is there a reason the code {a: never} cannot be simplified to just never? I believe this change would resolve the issues mentioned below. type A = {tag: 'A', value: number} type B = {tag: 'B', value: boolean} type N = {tag: never, valu ...

Dealing with the possibility of an empty array when accessing elements by index in Typescript

What is the best way to handle accessing elements by index in an array in Typescript when the array can be empty, resulting in potentially undefined elements? I am developing a simple game using React and Typescript where I have a variable named game whic ...

Is it possible to transform a webpack bundled javascript file into typescript source code?

Is it possible to decompile a webpack-bundled JavaScript file into TypeScript source code? I have a bundle.js file that was bundled using webpack, but the original source code files were accidentally deleted. I am hoping to reverse engineer the bundle.js ...

What is the reason behind the slight difference between TypeScript's IterableIterator<> and Generator<> generics?

In TypeScript version 3.6.3, there is a notable similarity between Generator<> and IterableIterator<>. However, when Generator<> extends Iterator<>, the third generic argument (TNext) defaults to unknown. On the other hand, Iterator ...

Strategies for dealing with Observable inconsistencies in an Angular application

Encountering an error during the compilation of my Angular app: The error message states: Type 'Observable<Promise<void>>' is not compatible with type 'Observable<AuthResponseData>'. The issue lies in 'Promis ...

How can a TypeScript function be used to retrieve a string (or JSON object)?

When attempting to retrieve data from a web API using TypeScript and return the JSON object, encountering an error has left me puzzled. Inside my function, I can successfully display the fetched data on the console, but when I try to return it with return ...

Transforming numbers into arrays in JavaScript/TypeScript for Angular 7

What is the best way to convert the number 10 into an array in JavaScript? expected output: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] OR How can I transform the number 10 into the number of items within an array using JavaScript? ...

What is the significance of `/// <reference types="react-scripts" />` in programming? Are there any other XML-like syntaxes that are commonly used in *.d.ts

When working with normal *.d.ts files (which are definition files for TypeScript), we typically use declare *** export interface *** However, there is also this syntax: /// <reference types="react-scripts" /> This syntax is generated by create- ...

Exploring the versatility of Highcharts with callback functions and comprehensive

Currently, I am utilizing Highcharts with angular 9. Here is the link to the code : https://stackblitz.com/edit/angular-ivy-wdejxk For running on the application side or test side, follow these instructions: Test Side: In the angular.json file at line ...

Error: Vercel deployment of Next.Js app fails due to undefined localStorage

Encountering the issue ReferenceError: localStorage is not defined when attempting to deploy my Next.JS app on Vercel. const NewReserve: React.FC = () => { const setValue = (key: string, value: string) => { return localStorage.setItem(key, val ...

A single element containing two duplicates of identical services

I am encountering an issue with my query builder service in a component where I need to use it twice. Despite trying to inject the service twice, it seems that they just reference each other instead of functioning independently, as shown below: @Component( ...

Best practice for exporting 3D models for use in WebGL from a Java-based web application

I am currently working on a web application that involves server-side manipulation of a 3D model and client-side viewing. I must use Java for the web application, and I still need to figure out how to interface the WebGL viewer with the application. Can a ...

How to color a tetrahedron using three.js

I've been experimenting with three.js to create a tetrahedron using THREE.TetrahedronGeometry where I want each face to be a different color. However, when I use MeshNormalMaterial, the faces display color gradients between vertices instead of having ...

An error occurred in the ngrx store with Angular during production build: TypeError - Unable to access property 'release' of undefined

After deploying my application and running it, I encountered an issue that seems to be happening only during production build at runtime. At this point, I am uncertain whether this is a bug or if there is a mistake in my code. The error "TypeError: Cannot ...