Cannot save an edited contact

Der-K-2000 commented 1 year ago

Describe the bug

With the new Contact-Version there is a huge problem, that appears, when I was editing an already existing contact and then want to save it via the save button (which is obviously new, because before an edited field was automatically saved).

The button is sometimes not clickable anymore.

But I don't see any logic behind this issue. The field and the input doesn't matter. Even after a page refresh.

Steps to reproduce

open a contact
click on edit button
edit/add a field
click save button

Expected behavior

button is clickable to save the edited fields and after that

Actual behavior

The button is not active anymore. The (graphical) mouseover hover works, the cursor is the pointer, but nothing happens, after the button is clicked.

Contact version

5.3.0-beta.1

Operating system

No response

PHP engine version

PHP 8.1

Web server

Apache (supported)

Database

MySQL

Additional info

No response

ChristophWurst commented 1 year ago

check the browser console log. any errors?

ChristophWurst commented 1 year ago

read/edit mode was added with https://github.com/nextcloud/contacts/pull/3347

Der-K-2000 commented 1 year ago

check the browser console log. any errors?

As soon as I can reproduce the issue (it's really random), I will coming back.

So far there is only this notification after nearly every interaction (but not specific related to the problem I mentioned above):

jQuery is deprecated: The global jQuery is deprecated. It will be removed in a later versions without another warning. Please ship your own.

Der-K-2000 commented 1 year ago

Ah now, it happens again. Those are the 2 outputs via Firefox (→ console), if I try to the save-button, but it isn't clickable anymore. Note: In the first output there are a lot of sub-objects, which are cropped here, and it seems Firefox cannot save the whole structure at once. I had to open every tree-link, which is too much for this moment.

The following contact has been repaired: invalid REV 
Object { jCal: Getter & Setter, addressbook: Getter & Setter, vCard: Getter & Setter, conflict: Getter & Setter, dav: Getter & Setter, … }

__ob__: Object { value: {…}, dep: {…}, vmCount: 0 }

dep: Object { id: 108811, subs: (21) […] }

id: 108811

subs: Array(21) [ {…}, {…}, {…}, … ]

0: Object { deep: false, user: false, lazy: true, … }

active: true

before: undefined

cb: function N(e, t, n)

length: 3

name: "N"

prototype: Object { … }

<prototype>: function ()

deep: false

depIds: Set(4) [ 60275, 108811, 108814, … ]

deps: Array(4) [ {…}, {…}, {…}, … ]

dirty: false

expression: ""

getter: function enableToggleBirthdayExclusion()

id: 2746

lazy: true

newDepIds: Set []

newDeps: Array []

sync: false

user: false

value: Object { jCal: Getter & Setter, parent: Getter & Setter, _hydratedPropertyCount: 10, … }

vm: Object { _uid: 545, _isVue: true, "$options": {…}, … }

<prototype>: Object { get: get(), addDep: addDep(e), cleanupDeps: cleanupDeps(), … }

1: Object { deep: false, user: false, lazy: false, … }

2: Object { deep: false, user: false, lazy: true, … }

3: Object { deep: false, user: false, lazy: true, … }

4: Object { deep: false, user: false, lazy: true, … }

5: Object { deep: false, user: false, lazy: false, … }

6: Object { deep: false, user: false, lazy: true, … }

7: Object { deep: false, user: false, lazy: true, … }

8: Object { deep: false, user: false, lazy: false, … }

9: Object { deep: false, user: false, lazy: true, … }

10: Object { deep: false, user: false, lazy: true, … }

11: Object { deep: false, user: false, lazy: true, … }

12: Object { deep: false, user: false, lazy: false, … }

13: Object { deep: false, user: false, lazy: true, … }

14: Object { deep: false, user: false, lazy: true, … }

15: Object { deep: false, user: false, lazy: true, … }

16: Object { deep: false, user: false, lazy: false, … }

17: Object { deep: false, user: false, lazy: true, … }

18: Object { deep: false, user: false, lazy: true, … }

19: Object { deep: false, user: false, lazy: true, … }

20: Object { deep: false, user: false, lazy: false, … }

length: 21

<prototype>: Array []

<prototype>: Object { addSub: addSub(e), removeSub: removeSub(e), depend: depend(), … }

value: Object { jCal: Getter & Setter, addressbook: Getter & Setter, vCard: Getter & Setter, … }

vmCount: 0

<prototype>: Object { walk: walk(e), observeArray: observeArray(e), … }

addressbook: 

conflict: 

dav: 

jCal: 

vCard: 

<get addressbook()>: function get()

<set addressbook()>: function set(t)

<get conflict()>: function get()

<set conflict()>: function set(t)

<get dav()>: function get()

<set dav()>: function set(t)

<get jCal()>: function get()

<set jCal()>: function set(t)

<get vCard()>: function get()

<set vCard()>: function set(t)

length: 1

name: "set"

prototype: Object { … }

<prototype>: function ()

<prototype>: Object { … }

addToGroup: function value(e)

constructor: function e(t, n)

displayName: 

email: 

firstIfArray: function value(e)

firstName: 

fullName: 

getPhotoUrl: function value()

groups: 

key: 

kind: 

lastName: 

managersName: 

org: 

phoneticFirstName: 

phoneticLastName: 

photo: 

properties: 

rev: 

searchData: 

title: 

toStringStripQuotes: function value()

uid: 

updateAddressbook: function value(e)

updateContact: function value(e)

url: 

version: 

<get displayName()>: function get()

<get email()>: function get()

<get firstName()>: function get()

<get fullName()>: function get()

<set fullName()>: function set(e)

<get groups()>: function get()

<set groups()>: function set(e)

<get key()>: function get()

<get kind()>: function get()

<get lastName()>: function get()

<get managersName()>: function get()

<get org()>: function get()

<set org()>: function set(e)

<get phoneticFirstName()>: function get()

<get phoneticLastName()>: function get()

<get photo()>: function get()

<set photo()>: function set(e)

<get properties()>: function get()

<get rev()>: function get()

<set rev()>: function set(e)

<get searchData()>: function get()

<get title()>: function get()

<set title()>: function set(e)

<get uid()>: function get()

<set uid()>: function set(e)

<get url()>: function get()

<get version()>: function get()

<set version()>: function set(e)

<prototype>: Object { … }
validate.js:48:6

and

Object { jCal: Getter & Setter, addressbook: Getter & Setter, vCard: Getter & Setter, conflict: Getter & Setter, dav: Getter & Setter, … }
validate.js:48:6
TypeError: e is undefined
    toICAL ical.js:429
    value ical.js:1698
    multiValue ical.js:1675
    property ical.js:1608
    component ical.js:1498
    toString ical.js:2772
    value contact.js:585
    n contacts.js:356
    c contacts.js:2
    y contacts.js:2
    v contacts.js:2
    gx contacts.js:2
    o contacts.js:2
    mx contacts.js:2
    mx contacts.js:2
    updateContact contacts.js:385
    FD vuex.esm.js:851
    dispatch vuex.esm.js:516
    dispatch vuex.esm.js:406
    t ContactDetails.vue:600
    c PropertyRev.vue:20
    y PropertyRev.vue:20
    v PropertyRev.vue:20
    hO PropertyRev.vue:20
    o PropertyRev.vue:20
    gO PropertyRev.vue:20
    gO PropertyRev.vue:20
    updateContact ContactDetails.vue:611
    t ContactDetails.vue:852
    c PropertyRev.vue:20
    y PropertyRev.vue:20
    v PropertyRev.vue:20
    hO PropertyRev.vue:20
    o PropertyRev.vue:20
    gO PropertyRev.vue:20
    gO PropertyRev.vue:20
    onSave ContactDetails.vue:853
    VueJS 2
    click index.module.js:2
    VueJS 3
vue.runtime.esm.js:1897:4
Got notification data, restoring default polling interval. NotificationsApp.vue:376

ChristophWurst commented 1 year ago

thanks

Der-K-2000 commented 1 year ago

I'm not quite sure about this and I actually doubt there is a relation, but the issue often happens to me, when I edit the phonetic* name(s) and try to save the contact unsuccessfully.

*alphanumeric signs, no IPA

st3iny commented 1 year ago

The form should transition automatically into view mode after pressing save. I suspect that there is an error happening while saving.

Could you please check the network tab of your dev tools while saving and look for failing requests (code 4XX or 5XX)?

Der-K-2000 commented 1 year ago

As I said, the button is inactive and not clickable sometimes, so there is also no interaction with the server (and therefore there are also no status codes I could submit).

The console output:

TypeError: e is undefined
    toICAL ical.js:429
    value ical.js:1698
    multiValue ical.js:1675
    property ical.js:1608
    component ical.js:1498
    toString ical.js:2772
    value contact.js:585
    n contacts.js:356
    c contacts.js:2
    y contacts.js:2
    v contacts.js:2
vue.runtime.esm.js:1897:4
    VueJS 6
    click index.module.js:2
    VueJS 33
jQuery is deprecated: The global jQuery is deprecated. It will be removed in a later versions without another warning. Please ship your own. 4 globals.js:59:15
jQuery is deprecated: The global jQuery is deprecated. It will be removed in a later versions without another warning. Please ship your own. 4 globals.js:59:15
Got notification data, restoring default polling interval. NotificationsApp.vue:376

st3iny commented 1 year ago

Is the save button is disabled right from the start? Just to clarify: You click the edit button and then the save button is not even clickable once?

Der-K-2000 commented 1 year ago

Mostly the button is clickable to save the edited fields, but sometimes not – and then it looks like that:

https://github.com/nextcloud/contacts/assets/7254827/1d93a0cd-4964-4593-816c-6d72dbc07042

st3iny commented 1 year ago

Thanks for the demo.

This is weird indeed. I'm still not able to reproduce it. Are you sure that there is no error (red log line) in the browser's console?

Does that happen with multiple contacts or just one specific contact? If so, would it be possible to share the vcf file so that I can have a look at it?

cometchaserde commented 1 year ago

Hi, I have also problems with the contact app. The browser console log: ContactDetails.vue:771 The following contact has been repaired: invalid REV Object { jCal: Getter & Setter, addressbook: Getter & Setter, vCard: Getter & Setter, conflict: Getter & Setter, dav: Getter & Setter, … } validate.js:48:6 XHRPUT https://xxx/nextcloud/remote.php/dav/addressbooks/users/admin/kontakte/917D2064-C6D4-4C44-8573-2A0DC8070CCB.vcf [HTTP/1.1 412 Precondition failed 60ms]

Error: a dist.js:1 i dist.js:1 r dist.js:1 i dist.js:1 r dist.js:1 i dist.js:1 r dist.js:1 onreadystatechange dist.js:1 e dist.js:1 contacts.js:374:4 This contact is outdated, the server refused it Object { jCal: Getter & Setter, addressbook: Getter & Setter, vCard: Getter & Setter, conflict: Getter & Setter, dav: Getter & Setter, … }

and a lot of: $ is deprecated: The global jQuery is deprecated. It will be removed in a later versions without another warning. Please ship your own.

Der-K-2000 commented 1 year ago

Thanks for the demo.

This is weird indeed. I'm still not able to reproduce it. Are you sure that there is no error (red log line) in the browser's console?

Does that happen with multiple contacts or just one specific contact? If so, would it be possible to share the vcf file so that I can have a look at it?

As mentioned it's totally random and it seems, that the issue has nothing to do with a specific field or a specific entry.

Yes, the error was red in the console (I guess).

But with 5.3.0-rc.1 I couldn't reproduce it so far.

0fbcb238c0 commented 1 year ago

I have the same issue. I can edit a contact once, but afterwards all changes will be lost, because the server refuses them. I have this problem since I started using Nextcloud, which has been almost a year now. I have the same issue for calendar items Problem only in Firefox, Chromium works fine.

Console output:

`XHRPUT [HTTP/2 412 Precondition Failed 29ms]

`

This contact is outdated, the server refused it Object { jCal: Getter & Setter, addressbook: Getter & Setter, vCard: Getter & Setter, conflict: Getter & Setter, dav: Getter & Setter, … } contacts.js:381:5 n contacts.js:381 u contacts.js:2 _ contacts.js:2 b contacts.js:2 um contacts.js:2 s contacts.js:2 (Async: promise callback) um contacts.js:2 o contacts.js:2 dm contacts.js:2 dm contacts.js:2 updateContact contacts.js:385 Af vuex.esm.js:851 dispatch vuex.esm.js:516 dispatch vuex.esm.js:406 t ContactDetails.vue:563 u PropertyRev.vue:19 _ PropertyRev.vue:19 b PropertyRev.vue:19 UA PropertyRev.vue:19 o PropertyRev.vue:19 A PropertyRev.vue:19 A PropertyRev.vue:19 updateContact ContactDetails.vue:572 add index.js:111 Zd index.js:284 add index.js:135 add index.js:97 debounceUpdateContact ContactDetails.vue:581 l index.js:27 (Async: setTimeout handler) c index.js:38 VueJS 28 _removeObjectByIndex ical.js:2571 _removeObject ical.js:2583 removeProperty ical.js:2738 fix invalidREV.js:58 Im validate.js:39

Der-K-2000 commented 1 year ago

Since 5.3.0-rc.1 (currently: 5.3.0-rc.3) the issue is gone, I think. I'm working often in the contacts and this error has not appeared again. Have you fixed something I missed? Probably we can close it here.

Der-K-2000 commented 1 year ago

It's back. 😒

I try to add

c wird wie z ausgesprochen

to the field Phonetischer Nachname

and I cannot save the contact:

Unable to update contact

v5.3.1

mschilli87 commented 1 year ago

@Der-K-2000: You latest comment looks unrelated to the initial issue here to me. Anyhow, in case it helps or anybody has a suggestion for me: I was pointed here after running into the 'Unable to update contact' message and posing on the help forums: https://help.nextcloud.com/t/unable-to-update-contact-s/167946 I provide some additional informartion there that might be useful to debug this issue.

Der-K-2000 commented 1 year ago

@Der-K-2000: You latest comment looks unrelated to the initial issue here to me.

Nope.

mschilli87 commented 1 year ago

Maybe I misunderstood than. Originally, use wrote

The button is sometimes not clickable anymore.

I cannot reproduce that.

However, now you said you receive an error message

Unable to update contact

which is what I also see for some (but not all!) of my contacts.

mschilli87 commented 1 year ago

Following up on the error message that I got in the log, I checked for tempfiles via

find /tmp -maxdepth 1 -user nextcloud -exec ls -lhtrA "{}" \+

and found a bunch of them, some dating back over a year. All of them were owned by my nextcloud user and the www-data group and had -rw-r--r-- permissions. Note: While my nginx user is in the www-data group as well, it would not have write access to those tempfiles.

I deleted all of those files via

find /tmp -maxdepth 1 -user nextcloud -exec sudo rm "{}" \+

but I can still reproduced the

Unable to update contact

error. Also, after doing so, no new file owned by the nextcloud user was created in the /tmp directory. 🤷

--

edit: Eventually, new files appeared but making them group-writable did not change the issue.

nextcloud / contacts