mermaid-js / mermaid-live-editor

Edit, preview and share mermaid charts/diagrams. New implementation of the live editor.
https://mermaid.live
MIT License
3.82k stars 574 forks source link

Editor Hangs: How to reset? #1466

Open tedyoung opened 3 weeks ago

tedyoung commented 3 weeks ago

Describe the bug Somehow I got into a state where the editor hangs and I have to kill the page (I was working on a sequence diagram, but the content is now lost). Now when I go to https://mermaid.live/edit, it shows an empty editor, but it still hangs. Is there a way to clear whatever is cached so I can use it again? If I open it in a private window, it's fine, so I'm guessing there's something in the history or cache that is preventing it from running properly.

Desktop (please complete the following information):

sidharthv96 commented 3 weeks ago

You should be able to clear data from chrome://settings/content/siteDetails?site=https%3A%2F%2Fmermaid.live We store the diagram history in localstorage.

sidharthv96 commented 3 weeks ago

It would be helpful if you can share the diagram code from localstorage, if you can get developer tools open in the page before you clear the data.

tedyoung commented 3 weeks ago

I think this is the one causing the problems, I was converting from a PlantUML format and was trying to fix line 9 (participant Ticketing) and it kept hanging for longer and longer until it would take minutes to respond.

sequenceDiagram

    autonumber

    actor Manager as "Venue Manager<br/><<browser>>"
    actor Buyer as "Ticket Buyer<br/><<browser>>"

    participant Vems as "Venue Event Management System<br/><<bounded context>>"
    participant Ticketing "Ticketing Selling<br><<bounded context>>" #DDEEFF

    box "Event Repository" #E0B0FF
        participant EventDB
    end
    participant GeoLocation as "GeoLocation Provider<br><<external service>>"
    participant Payment as "Payment Processor<br><<external service>>"
    box "Notification Service" #DDEEFF
        participant Notification
    end

    note over Manager,Email: Event Creation & Scheduling Flow

    Manager ->> Vems : Create Event
    Vems -->> Manager : Event Created Confirmation
    Manager ->> Vems : Schedule Ticket On-Sale

    Vems ->> Ticketing : ON_SALE_SCHEDULED\n<<integration event>>
    Vems -->> Manager : On-Sale Scheduled Confirmation

    Ticketing ->> Vems : Event Details?\n<<request>>
    Vems -->> Ticketing : Event Details (capacity, pricing, etc.)

    note over Buyer,Email: Ticket Buyer Flow

    Buyer ->> Ticketing : Show Me Upcoming Events
    Ticketing ->> EventDB : find venue locations with upcoming events
    EventDB -->> Ticketing : venue locations
    Ticketing ->> GeoLocation : Venues Within 50mile radius
    GeoLocation -->> Ticketing : Venue List
    Ticketing ->> EventDB : event query
    EventDB -->> Ticketing : Events
    Ticketing -->> Buyer : Event list

    Buyer ->> Ticketing : Show Tickets for Event
    Ticketing -->> Buyer : Event Details

    Buyer ->> Ticketing : Buy Tickets
    Ticketing -->> Buyer : Checkout Details
    Buyer ->> Ticketing : Purchase Tickets

    Ticketing ->> Payment : Payment Request Details
    Payment -->> Ticketing : Payment Approved
    Ticketing -->> Buyer : Payment Approved\nTicket Details
    Ticketing ->> Notification : Ticket Details
    Notification ->> PDF : Ticket Details
    PDF -->> Notification : PDF file
    Notification ->> Email : Ticket Details with PDF attached
    Ticketing -->> Vems : TICKETS_PURCHASED\n<<integration event>>