Pasted text into markdown field and hit cntrl+z to undo and got an error page #1432

peterlazzarino · 2018-06-13T14:54:48Z

I added a markdown type field to my page and after pasting a text block into it from my clipboard them command Z on my computer. I am sent to an error page, I can reliably reproduce this

Netlify CMS version: 1.7.0
Browser version: Chrome 67.0.3396.79
Node.JS version: 8.11.2
Operating System: Mac OSX 10.13.3

Config.yml - this is happening in the /about/our-team page in the leadership -> story field

backend:
  name: git-gateway
  branch: master

media_folder: static/img
public_folder: /img

collections:
  - name: "content"
    label: "General Content"
    create: true 
    files:
      - file: "src/content/layout.md"
        label: "Layout"
        name: "layout"
        slug: "layout"
        fields:
          - {label: "Template Key", name: "templateKey", widget: "hidden", default: "header"}
          - {label: "Title", name: "title", widget: "string", default: "header"}
          - {label: "Logo", name: "logo", widget: "image"}
          - {label: "Phone Number", name: "phone", widget: "string"}
          - {label: "Phone Number CTA", name: "phoneCTA", widget: "string"}
          - {label: "Phone Number icon", name: "phoneIcon", widget: "string"}
          - {label: "Header Links", name: "links", widget: "list", fields: [
              {label: Title, name: title, widget: string}, 
              {label: Description, name: description, widget: string},  
              {label: Url, name: url, widget: string, required: false },
              {label: Sublinks, name: sublinks, required: false, widget: "list", fields: [{label: Title, name: title, widget: string},{label: Url, name: url, widget: string}]}
            ]}
      
  - name: "blog"
    label: "Blog"
    folder: "src/pages/blog"
    create: true
    slug: "{{year}}-{{month}}-{{day}}-{{slug}}"
    fields:
      - {label: "Template Key", name: "templateKey", widget: "hidden", default: "blog-post"}
      - {label: "Title", name: "title", widget: "string"}
      - {label: "Publish Date", name: "date", widget: "datetime"}
      - {label: "Description", name: "description", widget: "text"}
      - {label: "Body", name: "body", widget: "markdown"}
      - {label: "Tags", name: "tags", widget: "list"}

  - name: "pages"
    label: "Pages"
    create: true 
    files:
      - file: "src/pages/home/index.md"
        label: "Home"
        name: "home"
        fields:
          - {label: "Template Key", name: "templateKey", widget: "hidden", default: "home-page"}
          - {label: "Title", name: "title", widget: "string"}
          - {label: "Body", name: "body", widget: "markdown"}
      - file: "src/pages/about/mission-statement/index.md"
        label: "Mission Statement"
        name: "mission-statement"
        fields:
          - {label: "Template Key", name: "templateKey", widget: "hidden", default: "mission-statement"}
          - {label: "Hero Banner", name: "headerimagehero", widget: "object", fields: [{name: "background",label: "Background Image",widget: "image"},{name: "title",label: "H1 Title",widget: "string"},{name: "description",label: "Description",widget: "string"}]}
          - {label: "Top Heading", name: "topheading", widget: "string"}
          - {label: "The Problem reasons", name: "problemreasons", widget: "list", fields: [{name: "number",label: "Number",widget: "number"},{name: "description",label: "Description",widget: "markdown"}]}
          - {label: "Middle Text", name: "middletext", widget: "string"}
          - {label: "Blurbs", name: "blurbs", widget: "list", fields: [{name: "title",label: "Title",widget: "string"},{name: "description",label: "Description",widget: "string"}]}
          - {label: "Did You Know Section", name: "didyouknow", widget: "object", fields: [{name: "text",label: "Text",widget: "markdown"},{name: "didyouknowheading",label: "Did You Know Heading",widget: "string"}, { label: "Did You Know Reason", name: "didyouknowreason", widget: "object", fields: [{name: "number",label: "Number",widget: "number"},{name: "description",label: "Description",widget: "markdown"}]}]}
          - {label: "Bottom Text", name: "bottomText", widget: "markdown"}                 
          - {label: "Hubspot Form ID", name: "hubspotFormId", widget: "string"}     
      - file: "src/pages/about/our-team/index.md"
        label: "Our Team"
        name: "our-team"
        fields:
          - {label: "Template Key", name: "templateKey", widget: "hidden", default: "our-team"}
          - {label: "Leadership Team Heading", name: "leaderHeading", widget: "object", fields: [{name: "heading", label: "Heading", widget: "string"}, {name: "description", label: "Description", widget: "string"}]}
          - {label: "Leadership Team", name: "leaders", widget: "list", fields: [{name: "fullName", label: "Full Name", widget: "string"},{name: "role", label: "Role", widget: "string"}, {name: "headshot", label: "Headshot", widget: "image"}, {name: "almaMater", label: "Alma Mater", widget: "string"}, {name: "major", label: "Major", widget: "string"}, {name: "petName", label: "Name of Pet", widget: "string"}, {name: "secondBestLanguage", label: "Second Best Language", widget: "string"}, {name: "story", label: "Story", widget: "markdown"}, {name: "background", label: "Background", widget: "markdown"}]}
          - {label: "Employee Team Heading", name: "employeeHeading", widget: "object", fields: [{name: "heading", label: "Heading", widget: "string"}, {name: "description", label: "Description", widget: "string"}]}
          - {label: "Employees", name: "employees", widget: "list", fields : [{name: "fullName", label: "Full Name", widget: "string"},{name: "role", label: "Role", widget: "string"}, {name: "image", Label: "Headshot", widget: "image"}]}
          - {label: "Board Heading", name: "boardHeading", widget: "object", fields: [{name: "heading", label: "Heading", widget: "string"}, {name: "description", label: "Description", widget: "string"}]}
          - {label: "Board", name: "board", widget: "list", fields: [{name: "fullName", label: "Full Name", widget: "string"},{name: "role", label: "Role", widget: "string"}, {name: "image", Label: "Headshot", widget: "image"}, {name: "story", label: "Story", widget: "markdown"}]}
      - file: "src/pages/apply/essay-editing/index.md"
        label: "Essay Editing"
        name: "essay-editing"
        fields:
          - {label: "Template Key", name: "templateKey", widget: "hidden", default: "mission-statement"}
          - {label: "Hero Banner", name: "headerimagehero", widget: "object", fields: [{name: "background",label: "Background Image",widget: "image"},{name: "title",label: "H1 Title",widget: "string"},{name: "description",label: "Description",widget: "string"}]}
          - {label: "Top Heading", name: "topheading", widget: "string"}               
          - {label: "Top Section Left", name: "topSectionLeft", widget: "markdown"}             
          - {label: "Top Section Right", name: "topSectionRight", widget: "markdown"}           
          - {label: "Essay Step Examples", name: "essayStepExamples", widget: "list", fields: [{name: "heading", label: "Heading", widget: "string"},{name: "description", label: "Description", widget: "string"},{name: "example", label: "Example", widget: "image"}]}       
          - {label: "Essay Ideation Process", name: "essayIdeationProcess", widget: "object", fields: [{name: "title",label: "Title",widget: "string"},{name: "ideationItems", label: "Ideation Items", widget: "list", fields: [{ name : "title", label : "Title", widget: "string"}, {name: "description", label: "Description", widget: "text"}]} ]}       
          - {label: "Additional Application Services", name: "applicationServices", widget: "object", fields: [{name: "title",label: "Title",widget: "string"},{name: "ideationItems", label: "Ideation Items", widget: "list", fields: [{ name : "title", label : "Title", widget: "string"}, {name: "description", label: "Description", widget: "text"}]} ]}       
          - {label: "Hubspot Form ID", name: "hubspotFormId", widget: "string"}

papandreou · 2018-06-13T15:16:01Z

One of my colleagues experienced this as well (Chrome on WIndows), but I haven't been able to reproduce it myself on Browserstack. He's doing a lot of pasting from Google slides into netlify-cms, so it's quite likely to be the same problem.

tech4him1 · 2018-06-13T23:45:53Z

@peterlazzarino Is this happening for every text block, or only certain ones? If so, can you provide an example?

papandreou · 2018-06-14T08:33:35Z

It happened to me now while debugging something else on Chrome 67/Windows in Browserstack. Steps to reproduce:

Create a new item in a collection
Paste the text src/components/EditorWidgets/Markdown/serializers/index.js into a markdown field (just a funny coincidence)
Hit CTRL+z

This error screen is displayed:

Sorry!
There's been an error - please report it!

Error: Invalid `key` argument! It must be a key string, but you passed: null

The following error is logged twice in the console:

react-dom.production.min.js:187 Error: Invalid `key` argument! It must be a key string, but you passed: null
    at y (node.js:2229)
    at t.value (node.js:812)
    at t.e.(:5000/admin/anonymous function) [as getFurthestAncestor] (http://localhost:5000/node_modules/netlify-cms-papandreou/dist/cms.js:35:11289)
    at t.value [as getSelectionIndexes] (node.js:1521)
    at t.value (content.js:429)
    at Si (react-dom.production.min.js:166)
    at Ai (react-dom.production.min.js:179)
    at ua (react-dom.production.min.js:201)
    at ca (react-dom.production.min.js:202)
    at Ka (react-dom.production.min.js:211)

(Yeah, I know I'm using my fork, but I doubt that has anything to do with it :)

papandreou · 2018-06-14T08:46:50Z

It's reproducible with the same steps on Chrome 67/OSX. Seems like the important thing is pasting into an empty markdown widget, then hitting CTRL+z.

tech4him1 · 2018-06-15T02:49:17Z

Comfirmed, this is affecting top-level markdown widgets as well. @erquhart?

robertkarlsson · 2018-06-15T08:41:15Z

I did a quick look into this and if it can be to any help, this seems to be triggered after the startKey and endKey of the operation in slate.js both have the value null, which they are when copy paste -> ctrl +z without interacting with the field by input before that action.

This then triggers this line since null == null
https://github.com/ianstormtaylor/slate/blob/d884be872de30963255d1bbb5b152ca36aaba126/packages/slate/src/models/node.js#L1523

And from there runs the getFurthestAncestor

https://github.com/ianstormtaylor/slate/blob/d884be872de30963255d1bbb5b152ca36aaba126/packages/slate/src/models/node.js#L801

which then runs the assertKey:

https://github.com/ianstormtaylor/slate/blob/d884be872de30963255d1bbb5b152ca36aaba126/packages/slate/src/models/node.js#L2059

where the error triggers.

I guess the first thing to look at is why the startKey and endKey is null on that exact operation, and not when for example doing the exact same thing, but after the field has already been interacted with before (by putting something in it).

I will probably look at this a bit more since i find these kinds of problems interesting (reminds me a lot of problems we've had with draftJS) when I have time. Hope this can be to any help!

erquhart · 2018-06-15T19:49:30Z

@robertkarlsson really awesome that you're digging into this! I'm wondering if this would be solved by updating Slate, I know we're behind a bit.

robertkarlsson · 2018-06-15T22:36:51Z

@erquhart You seem to be correct about this according to this issue: ianstormtaylor/slate#1448

The fix was done in: ianstormtaylor/slate@b2e0612
and released in [email protected]

When upgrading to [email protected] (latest) i can not reproduce this error anymore.

It's past midnight here in the north so i wont be making a PR right now, but it should solve the issue if someone wants to do one. The other slate related dependencies as slate react may also benefit from an upgrade.

Fixes decaporg#1432 Update Slate and Slate plugin dependencies to be up to date with current versions. Change node.kind -> node.object according to deprecation warning introduced in Slate 0.32.0 Update Jest snapshot to pass the change from node.kind -> node.object

Fixes decaporg#1432 Update Slate and Slate plugin dependencies to be up to date with current versions. Change setBlock -> setBLocks according to deprecation warning in slate 0.33.0 Change node.kind -> node.object according to deprecation warning in Slate 0.32.0 Update Jest snapshot to pass the change from node.kind -> node.object

Fixes decaporg#1432 Update Slate and Slate plugin dependencies to be up to date with current versions. Change setBlock -> setBLocks according to deprecation warning in slate 0.33.0 Change node.kind -> node.object according to deprecation warning in Slate 0.32.0 Update Jest snapshot to pass the change from node.kind -> node.object (cherry picked from commit 756bf4b)

Fixes decaporg#1432 Update Slate and Slate plugin dependencies to be up to date with current versions. Change setBlock -> setBLocks according to deprecation warning in slate 0.33.0 Change node.kind -> node.object according to deprecation warning in Slate 0.32.0 Update Jest snapshot to pass the change from node.kind -> node.object

erquhart added kind: bug exp: intermediate area: extensions/widgets/markdown labels Jun 13, 2018

tech4him1 added the status: confirmed label Jun 15, 2018

tech4him1 mentioned this issue Jun 18, 2018

Values from string and markdown widgets come out as either empty string or undefined, depending on whether the field has been edited #1449

Closed

robertkarlsson mentioned this issue Jun 18, 2018

Update Slate dependencies #1451

Merged

tech4him1 added the claimed label Aug 16, 2018

erquhart closed this as completed in #1451 Aug 23, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Pasted text into markdown field and hit cntrl+z to undo and got an error page #1432

Pasted text into markdown field and hit cntrl+z to undo and got an error page #1432

peterlazzarino commented Jun 13, 2018 •

edited by tech4him1

Loading

papandreou commented Jun 13, 2018

tech4him1 commented Jun 13, 2018

papandreou commented Jun 14, 2018

papandreou commented Jun 14, 2018

tech4him1 commented Jun 15, 2018

robertkarlsson commented Jun 15, 2018 •

edited

Loading

erquhart commented Jun 15, 2018

robertkarlsson commented Jun 15, 2018 •

edited

Loading

Pasted text into markdown field and hit cntrl+z to undo and got an error page #1432

Pasted text into markdown field and hit cntrl+z to undo and got an error page #1432

Comments

peterlazzarino commented Jun 13, 2018 • edited by tech4him1 Loading

papandreou commented Jun 13, 2018

tech4him1 commented Jun 13, 2018

papandreou commented Jun 14, 2018

papandreou commented Jun 14, 2018

tech4him1 commented Jun 15, 2018

robertkarlsson commented Jun 15, 2018 • edited Loading

erquhart commented Jun 15, 2018

robertkarlsson commented Jun 15, 2018 • edited Loading

peterlazzarino commented Jun 13, 2018 •

edited by tech4him1

Loading

robertkarlsson commented Jun 15, 2018 •

edited

Loading

robertkarlsson commented Jun 15, 2018 •

edited

Loading