Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

When using Chrome/Edge/Firefox in Windows 11, the cursor drifts and is misaligned when using Microsoft Pinyin Input Method to input Chinese in the "Body" text editing box. #6287

Closed
Songyon opened this issue Mar 12, 2022 · 9 comments
Labels
area: extensions/widgets/markdown type: bug code to address defects in shipped code

Comments

@Songyon
Copy link

Songyon commented Mar 12, 2022

Describe the bug
When using Chrome/Edge/Firefox in Windows 11, the cursor drifts and is misaligned when using Microsoft Pinyin Input Method to input Chinese in the "Body" text editing box.

To Reproduce

  1. Open the Netlify CMS and create a new post.
  2. Click the "Body" textfield and try to use Microsoft Pinyin Input Method to input Chinese characters.
  3. That you can maybe see the error.

Expected behavior
Input Chinese characters normally and the cursor does not shift.

Applicable Versions:

  • Netlify CMS version: 2.0.10
  • Git provider: GitHub
  • OS: Windows 11
  • Browser version: Edge 99 and Firefox 98

CMS configuration

backend:
  name: git-gateway # https://github.com/netlify/netlify-cms
  branch: main # 要更新的分支(可选;默认为主分支)

# This line should *not* be indented
publish_mode: editorial_workflow

# This line should *not* be indented
media_folder: "themes/fluid/source/img" # 媒体文件将存储在图片/上载下的Repo中。
public_folder: "/img" # 上传的媒体的src属性将以/images/uploads开头。

site_url:  # 网站网址
display_url:  # 显示网址
logo_url: 

locale: "zh_Hans" # 语言环境 https://github.com/netlify/netlify-cms/tree/master/packages/netlify-cms-locales/src

auto_generator:
  post: 
    # 如果你有多个Post文件夹,在这里定义多个,见https://github.com/jiangtj/blog/blob/master/netlify-cms.yaml
    all_posts:
      # 设置为false,关闭默认的Post
      enabled: false
      label: "Post"
      folder: "source/_posts"
      create: true
      editor:
        preview: true
  # Page生成配置
  page: 
    enabled: false
    config:
      label: "Page"
      # 默认禁止删除Page文件
      delete: false
      editor:
        preview: true

collections:      # https://www.netlifycms.org/docs/configuration-options/#collections
  - name: "posts" # 在路由中使用,例如:/admin/collections/blog。
    label: "文章" # 在用户界面中使用
    
    folder: "source/_posts" # 存储文件的文件夹的路径。
    create: true # 允许用户在这个集合中创建新的文件。
    fields: # 每份文件的字段,通常是前面的内容。
      - {label: "标题", name: "title", widget: "string"}
      - {label: "作者", name: "author", widget: "string", required: false} 
      - {label: "摘要", name: "excerpt", widget: "list", required: false}
      - {label: "文章页顶部大图", name: "banner_img", widget: "image", required: false} 
      - {label: "文章在首页的封面图", name: "index_img", widget: "image", required: false} 
      - {label: "发布日期", name: "date", widget: "datetime", format: "YYYY-MM-DD HH:mm:ss", dateFormat: "YYYY-MM-DD", timeFormat: "HH:mm:ss", required: false}
      # - {label: "更新日期", name: "updated", widget: "datetime", format: "YYYY-MM-DD HH:mm:ss", dateFormat: "YYYY-MM-DD", timeFormat: "HH:mm:ss", required: false}
      - {label: "永久链接", name: "permalink", widget: "string", required: false}
      - {label: "内容", name: "body", widget: "markdown", required: false}
      - {label: "标签", name: "tags", widget: "list", required: false}
      #- {label: "分类", name: "categories", widget: "list", required: false}
      - {label: "文章排序权重", name: "sticky", widget: "number", required: false}
      - {label: "在首页中隐藏此文章", name: "hide", widget: "boolean", default: false, required: false}
      #  comment: 'This is a multiline\ncomment'
      # - {label: "评论区", name: "comments", widget: "boolean", default: true, required: false}
      # - {label: "关键词", name: "keywords", widget: "list", required: false}
    editor:
      preview: true
@Songyon Songyon added the type: bug code to address defects in shipped code label Mar 12, 2022
@Songyon Songyon changed the title Please replace with a clear and descriptive title When using Chrome/Edge/Firefox in Windows 11, the cursor drifts and is misaligned when using Microsoft Pinyin Input Method to input Chinese in the "Body" text editing box. Mar 12, 2022
@kyoshino
Copy link

The similar/same issue is happening with Japanese IME (Google Japanese Input).

@GOKORURI007
Copy link

This bug also appeared on Windows10,but did not appeared on Linux (test on Majaro) .

This GIF shows what happend when use IME on Windows10/11:
Test_on_Windows11

@0x3st
Copy link

0x3st commented Jan 7, 2023

Did anyone fix the markdown editor? Importing an advanced editor when the value of widget is markdown might be helpful. It seems that the rich text editor should be to be blame. Delete rich text editor when using IME Chinese might help things out since I cannot prove my ideas on my own.

@GGBeng1
Copy link

GGBeng1 commented Jan 29, 2023

same problem

@Songyon
Copy link
Author

Songyon commented Apr 21, 2023

The issue is still there in Decap CMS.

@martinjagodic
Copy link
Member

We are actively working on updating Slate, which is the root of all editor problems. In the meantime, you can try this fix: #5092 (comment)

@Songyon
Copy link
Author

Songyon commented Apr 22, 2023

We are actively working on updating Slate, which is the root of all editor problems. In the meantime, you can try this fix: #5092 (comment)

Thank you for giving #5092 , but I still have this problem on Firefox 113 and Chromium 113 after adding this code to my site Head.

@martinjagodic
Copy link
Member

@Songyon can you confirm that this is solved in Decap 3?

@Songyon
Copy link
Author

Songyon commented Aug 26, 2023

@Songyon can you confirm that this is solved in Decap 3?

Thank you. After my attempt, I confirmed that the problem has been fixed.

@Songyon Songyon closed this as completed Aug 26, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area: extensions/widgets/markdown type: bug code to address defects in shipped code
Projects
None yet
Development

No branches or pull requests

6 participants