Skip to content

GitLab

  • Projects
  • Groups
  • Snippets
  • Help
    • Loading...
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
    • Switch to GitLab Next
  • Sign in / Register
A
Angular IsLoadingService
  • Project overview
    • Project overview
    • Details
    • Activity
    • Releases
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
    • Locked Files
  • Issues 1
    • Issues 1
    • List
    • Boards
    • Labels
    • Service Desk
    • Milestones
    • Iterations
  • Merge Requests 0
    • Merge Requests 0
  • Requirements
    • Requirements
    • List
  • CI / CD
    • CI / CD
    • Pipelines
    • Jobs
    • Schedules
    • Test Cases
  • Security & Compliance
    • Security & Compliance
    • Dependency List
    • License Compliance
  • Operations
    • Operations
    • Incidents
    • Environments
  • Packages & Registries
    • Packages & Registries
    • Package Registry
    • Container Registry
  • Analytics
    • Analytics
    • CI / CD
    • Code Review
    • Insights
    • Issue
    • Repository
    • Value Stream
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Members
    • Members
  • Collapse sidebar
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
  • service-work
  • Angular IsLoadingService
  • Issues
  • #3

Closed
Open
Opened Sep 19, 2019 by Seán@cname87

Pass synchronous observable to isLoadingService.add() - isLoading doesn't cancel as expected

Under certain conditions, an api call may return a synchronous observable, such as of([]), rather than accessing a backend service. If you pass the function of(), (which returns an observable synchronously), to isLoadingService.add() the loading indicator is set but never cancels. Note that if you make of() asynchronous, by using the scheduled function, and pass that to isLoadingService, then isLoadingService cancels the isLoading indicator (on the next event turn) as expected.

TEST 1

import { IsLoadingService } from '@service-work/is-loading';
import { of } from 'rxjs';

const isLoadingService = new IsLoadingService();

/* synchronous observable */
isLoadingService.add(of(['testValue']));

/* isLoading: true - expected? */
console.log('isLoading: ' + isLoadingService.isLoading()); // isLoading: true

/* try remove isLoading indicator */
isLoadingService.remove();

/* isLoading: true - expected? */
console.log('isLoading: ' + isLoadingService.isLoading()); // isLoading: true

/* wait a turn /
setTimeout(() => {
/
isLoading: true - expected? */
console.log('isLoading: ' + isLoadingService.isLoading()); // isLoading: true

/* try remove isLoading indicator */
isLoadingService.remove();

/* isLoading: true - expected? */
console.log('isLoading: ' + isLoadingService.isLoading()); // isLoading: true

}, 0);

Console output

isLoading: true
isLoading: true
isLoading: true
isLoading: true

TEST 2

import { IsLoadingService } from '@service-work/is-loading';
import { scheduled, asapScheduler } from 'rxjs';

const isLoadingService = new IsLoadingService();

/* asynchronous observable */
isLoadingService.add(scheduled(of(['testValue']), asapScheduler));

/* isLoading: true as expected */
console.log('isLoading: ' + isLoadingService.isLoading()); // isLoading: true

setTimeout(() => {
/* isLoading: false as isLoadingService removes the isLoading indicator following take(1) from the observable */
console.log('isLoading: ' + isLoadingService.isLoading()); // isLoading: false
}, 0);

Console output:

isLoading: true
isLoading: false

Assignee
Assign to
None
Milestone
None
Assign milestone
Time tracking
None
Due date
None
Reference: service-work/is-loading#3