ERROR ReferenceError: regeneratorRuntime is not defined

[gubo]

Expected Behavior

Expect Contentful SDK in Angular 11 project to work against sample space.

Actual Behavior

Browser throws error:
core.js:5967 ERROR ReferenceError: regeneratorRuntime is not defined
at Object._getEntries (create-contentful-api.js:393)
at Object.getEntries (create-contentful-api.js:371)
at AppComponent.ngOnInit (app.component.ts:26)
at callHook (core.js:2486)
at callHooks (core.js:2456)
at executeInitAndCheckHooks (core.js:2408)
at refreshView (core.js:9194)
at renderComponentOrTemplate (core.js:9293)
at tickRootContext (core.js:10519)
at detectChangesInRootView (core.js:10544)

Possible Solution

Regarding #496, seems is not fixed.

Steps to Reproduce

package.json

{
    "name": "contentful-product-catalog-angular",
    "version": "0.0.0",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "~11.0.5",
        "@angular/common": "~11.0.5",
        "@angular/compiler": "~11.0.5",
        "@angular/core": "~11.0.5",
        "@angular/forms": "~11.0.5",
        "@angular/platform-browser": "~11.0.5",
        "@angular/platform-browser-dynamic": "~11.0.5",
        "@angular/router": "~11.0.5",
        "contentful": "^8.1.6",
        "rxjs": "~6.6.0",
        "tslib": "^2.0.0",
        "zone.js": "~0.10.2"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "~0.1100.5",
        "@angular/cli": "~11.0.5",
        "@angular/compiler-cli": "~11.0.5",
        "@types/jasmine": "~3.6.0",
        "@types/node": "^12.11.1",
        "codelyzer": "^6.0.0",
        "jasmine-core": "~3.6.0",
        "jasmine-spec-reporter": "~5.0.0",
        "karma": "~5.1.0",
        "karma-chrome-launcher": "~3.1.0",
        "karma-coverage": "~2.0.3",
        "karma-jasmine": "~4.0.0",
        "karma-jasmine-html-reporter": "^1.5.0",
        "protractor": "~7.0.0",
        "ts-node": "~8.3.0",
        "tslint": "~6.1.0",
        "typescript": "~4.0.2"
    }
}

app.component.ts

import { Component, OnInit } from '@angular/core';
import { createClient } from 'contentful';

const CONFIG = {
  space: 'wl1z0pal05vy',
  accessToken:
    '0e3ec801b5af550c8a1257e8623b1c77ac9b3d8fcfc1b2b7494e3cb77878f92a',
  contentTypeIds: {
    product: '2PqfXUJwE8qSYKuM0U6w8M',
  },
};

@Component({
  selector: 'app-root',
  template: `<div>contentful test</div>`,
})
export class AppComponent implements OnInit {
  private cdaClient = createClient({
    space: CONFIG.space,
    accessToken: CONFIG.accessToken,
  });

  ngOnInit(): void {
    console.log(this.cdaClient);
    this.cdaClient
      .getEntries(
        Object.assign({
          content_type: CONFIG.contentTypeIds.product,
        })
      )
      .then((a: any) => console.log(a));
  }
}

Context

Angular SPA to use Contentful delivery/preview.

Environment

Angular CLI: 11.0.5
Node: 14.8.0
OS: darwin x64

Angular: 11.0.5
Ivy Workspace: Yes

@angular-devkit/architect 0.1100.5
@angular-devkit/build-angular 0.1100.5
@angular-devkit/core 11.0.5
@angular-devkit/schematics 11.0.5
@schematics/angular 11.0.5
@schematics/update 0.1100.5
rxjs 6.6.3
typescript 4.0.5

Chrome Version 87.0.4280.88 (Official Build) (x86_64)
Edge Version 88.0.705.29 (Official build) Beta (64-bit)
Safari Version 13.1.2 (13609.3.5.1.5)

[ch-ivy]

I'm having this same issue with contentful, please any fix?????

[pguso]

As a quick fix add the following two lines at the top of the app.component.ts file, you don't get an error anymore

import "core-js/stable";
import "regenerator-runtime/runtime";

[mat-sf]

Any update on this?

[grahammatt]

I am continuing to experience this issue as well.
Adding this import above the contentful imports works as a fix for now

import "regenerator-runtime/runtime.js";

[rustyy]

Rolling back to 7.15.2 solves this as well.

Is it a more general issue? I'm able to reproduce this with a simple js file and webpack (see: https://github.com/rustyy/contentful-issue-545). Or am I missing something?

[makinwab]

You can find out more about how to migrate from version 7.x.x here. It touches on how to setup Regenerator Runtime for the browser.

[VirMaker]

I'm running into 2 issue on migration from contentful 7.15.2 to 8.x.x:

1. Client side issue described here above which can be solved by importing regenerator-runtime/runtime
2. Server side contentful calls (Angular universal) no longer work (awaited?). The call is being executed but the page does not have those results. Looks like this issue was introduced in 8.0.1, works fine with 8.0.0;

Current environment:

• Node 15.7
• Angular 11.1.x
• Contentful 8.x

We are trying to move away from 7.15.2 because of axios vulnerabilities:
contentful 1.0.0 - 2.1.2 || 4.0.0 - 5.0.3 || 7.1.0-beta0 - 7.1.0-beta1 || 7.5.0 - 8.0.2 Depends on vulnerable versions of axios

[marcolink]

Hello,

I made a new PR addressing this problem. Once it's approved, I'll post an update here

[VirMaker]

@marcolink thank you! Could you please clarify if your PR should also fix server side calls? I have bundled up client side and server side issues together but the more I think about those the more I'm questioning if those are related

[marcolink]

Hi @VirMaker,

The PR addresses all issues related to bundling the library (especially the regenerator-runtime problem).
I expect it to work the same way as prior to version 8.

I wonder what changed from Changeset 8.0.0...8.0.1 that could make your build break. 🤔

[VirMaker]

@marcolink, not sure. When using 8.0.0 I see regenerator-runtime error on the server and the client. With 8.0.1+ I no longer see this (or any other) errors on the server, only client, but server side contentful requests no longer complete before page is flushed to the client

[marcolink]

A new version has been released https://github.com/contentful/contentful.js/releases/tag/v8.1.8

This version only expects the regeneratorRuntime for the legacy browser bundle.

I'll close the Issue for now. Please feel free to open it again if you detect any related issues.

[VirMaker]

@marcolink, thank you. Issue #1 (client side) is resolved, but I still experience issue #2 (server side):
Server side contentful calls (Angular universal) no longer work (awaited?). The call is being executed but the page does not have those results. Looks like this issue was introduced in 8.0.1, works fine with 8.0.0;
Does it make sense to open another issue for this?