ReactiveX / ReactiveX/rxjs

innerFrom treats anything with "length" property as an array, even if this anything has iterable implemented

Open
#7,497 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
31.7k
Forks
3k
PR merge metrics
No merged PRs in 30d

Description

Describe the bug

Hello! I've encountered an error in rxjs published as latest (7.8.1 as of writing this)

I've built a simple iterable structure for a specific task. It also had a length property, since I needed to check for that in my operator function.

When I've put that iterable object into from, it did nothing. Some digging showed up that innerFrom treats anything with length property as array just by having that said property and not being a function.

Either isArrayLike should be changed in some way to fit the fromArrayLike or order of checks should be different, so that iterables that are not arrays, but have length property, would be treated as iterables

Expected behavior

from({ [Symbol.iterable](): { ... }, get length() { ... } }) should treat argument as iterable

Reproduction code
import './style.css';

import { from } from 'rxjs';

export class Example<T> implements Iterable<T> {
  private items: T[] = [];

  public add(item: T) {
    this.items.push(item);
  }

  // comment this getter out to see the difference
  public get length() {
    return this.items.length;
  }

  private *generator() {
    for (let i = 0; i < this.items.length; i++) {
      yield this.items[i];
    }
  }

  [Symbol.iterator](): Iterator<T, any, undefined> {
    return this.generator();
  }
}

const queue = new Example<string>();
queue.add('kek');
queue.add('lol');
queue.add('wut');
for (const value of queue) {
  console.log(value);
}
from(queue).subscribe((value) => console.log(value));
// look at the console
// the "for" loop logs values correctly
// while observable thing does that only if "length" getter is commented out


### Reproduction URL

https://stackblitz.com/edit/rxjs-gsebx7?file=index.ts

### Version

7.8.1

### Environment

_No response_

### Additional context

_No response_

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the innerFrom, isArrayLike, and fromArrayLike entry points described in the issue, then run the linked StackBlitz reproduction with the length getter enabled. Confirm how from handles an object that has both length and Symbol.iterator; done means the iterable values are emitted instead of the object being treated as array-like, with regression coverage for this case.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
api
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.