Uploaded image for project: 'Magnolia Frontend Helpers'
  1. Magnolia Frontend Helpers
  2. MGNLFE-209

React Editor: Green bars not rendering in React 18 (Used by latest Next.js)

    XMLWordPrintable

Details

    Description

      Steps to reproduce:

      1. Download the Magnolia SPA demo project:
      https://git.magnolia-cms.com/projects/DEMOS/repos/minimal-headless-spa-demos/browse

      2. Install latest Magnolia community edition. Start Magnolia.

      3. Open the nextjs-ssg-minimal project. Install dependencies (npm install) and run project in development mode (npm run dev).

      4. Create root node page called "nextjs-ssg-minimal" with the "Next.js SSG: Basic" template.

      Open the page and confirm that green bars are visible for the page. Everything should be working fine at the moment.

      5. Stop the Next.js application.

      6. Update project dependencies to the latest Next.js values (with React 18):

        "dependencies": {
          "next": "12.1.6",
          "react": "18.1.0",
          "react-dom": "18.1.0",
          "@magnolia/react-editor": "^1.2.2"
        },
        "devDependencies": {
          "eslint": "8.17.0",
          "eslint-config-next": "12.1.6"
        },

      7. Delete the "package-lock.json" file and the "node_modules" folder.

      8. Re-install dependencies with "npm install".

      9. Start the Next.js app: "npm run dev"

      In Magnolia, re-open the page. Green edit bars no longer appear.

      Notes
      This is not related to the issue with Angular-editor 1.2.2.

      Checklists

        Acceptance criteria

        Attachments

          Issue Links

            Activity

              People

                oanh.thai Oanh Thai Hoang
                nhorstad Niclas Horstad
                DeveloperX
                Votes:
                1 Vote for this issue
                Watchers:
                5 Start watching this issue

                Dates

                  Created:
                  Updated:
                  Resolved:

                  Checklists

                    Bug DoR
                    Task DoD

                    Time Tracking

                      Estimated:
                      Original Estimate - Not Specified
                      Not Specified
                      Remaining:
                      Remaining Estimate - 0d
                      0d
                      Logged:
                      Time Spent - 7d 6.75h
                      7d 6.75h