search

getkirby / kirby

Kirby's core application folder
https://getkirby.com
Other
1.27k stars 167 forks source link

[3.8.0-rc.1] new object field some console errors #4681

Closed afbora closed 2 years ago

afbora commented 2 years ago

Sorry for overlooking the errors in the console before the PR merged.

Few issues

  1. When first click add and open the drawer

Uncaught TypeError: Cannot read properties of undefined (reading 'isOpen') Uncaught TypeError: Cannot read properties of undefined (reading 'open')

  1. When click tags field

Uncaught TypeError: Cannot read properties of undefined (reading 'focus')

Sample blueprint

fields:      
  person:
    label: Person
    type: object
    fields:
      category:
        label: Category
        type: multiselect
        options:
          design: Design
          architecture: Architecture
          photography: Photography
          3d: 3D
          web: Web
      name:
        type: text
      pages:
        type: pages
      files:
        type: files
      tags:
        type: tags
distantnative commented 2 years ago

Cannot reproduce this.

afbora commented 2 years ago

https://user-images.githubusercontent.com/3393422/191491705-c37dbd76-a657-40b3-85a0-87eca09dff25.mp4

distantnative commented 2 years ago

Looks like you aren't running npm run dev?

afbora commented 2 years ago

Yes, I always run my tests with build.

distantnative commented 2 years ago

Cannot reproduce it with build either. Have you deleted the media folder before testing?

afbora commented 2 years ago

Have you deleted the media folder before testing?

Always 🙂

afbora commented 2 years ago

I've tested on Firefox and same..

bastianallgeier commented 2 years ago

Hm, I wonder if this is a Windows vs. Mac problem. I cannot reproduce it either. So weird.

afbora commented 2 years ago

I've tracked down and I've some clues.. I guess this is about click event.

  1. Triggered click event from object field: https://github.com/getkirby/kirby/blob/develop/panel/src/components/Forms/Field/ObjectField.vue#L19

  2. Multiselect field catches the click event and tries to open or close the ref: https://github.com/getkirby/kirby/blob/44158e8a5856384f35b07263240abc96db16ae7e/panel/src/components/Forms/Input/MultiselectInput.vue#L205-L212

afbora commented 2 years ago

@bastianallgeier I have prepared a rough PR https://github.com/getkirby/kirby/pull/4685 for you that fixes the issue. It can give you an idea.

afbora commented 2 years ago

@bastianallgeier @distantnative Now I've steps to reproduce. Critical step is refresh (hard) the page.

  1. Login panel
  2. Edit any page that have related sample fields in first comment https://github.com/getkirby/kirby/issues/4681#issue-1380754676
  3. Before click object, hard refresh the page
  4. Click to object field
  5. Check console error
bastianallgeier commented 2 years ago

✅