getting data from the chrome storage doesn't trigger change detection about ng-chrome-extension HOT 2 CLOSED

Hi, there is nothing wrong with the extension, its just how an extension works.

You have to add "storage" permission to the manifest.json

  "permissions": [
    "tabs",
    "storage"
  ]

After that it just works after clicking the button.

@Component({
  selector: 'app-popup',
  templateUrl: 'popup.component.html',
  styleUrls: ['popup.component.scss']
})
export class PopupComponent implements OnInit {
  message: string;

  constructor(@Inject(TAB_ID) readonly tabId: number) {}

  ngOnInit(): void {
    chrome.storage.local.set({ favoriteCocktail: 'Daiquiri' })
  }

  async onClick(): Promise<void> {
    this.message = await bindCallback<string>(chrome.storage.local.get.bind(chrome.storage.local, { favoriteCocktail: 'Daiquiri' }))()
      .pipe(map((result) => result['favoriteCocktail']))
      .toPromise();
  }
}

from ng-chrome-extension.

Hey Larscom,

I had added storage to the permissions already, but my problem was still happening. I have now switched over to the await code you posted and indeed it is working with that. I find it rather strange though that when passing the chrome storage directly as observable instead of making it a promise and awaiting it, it's not working.

I tried to cast the "sendMessage" example from the scaffold directly into an Observable (without .toPromise and await) and that seemed to work perfectly. But for some reason the storage callback doesn't like to be an Observable. Anyway my problem is solved so thanks for your help!

from ng-chrome-extension.