Autocomplete inputs (e.g. OMP 3.1.2 Add spotlight feature) are broken

[ajnyga]

If I try to add a new Spotlight item, the autocomplete title search does now work.

I have added one title to the press. Searching for that title gives me two matches.

If I proceed to choose the "Test title" the value entered to the field is a mysterious 1:3. Saving the form then gives me an error "An item is required.".

[ajnyga]

These javascript warnings appear when I open the Add Spotlight form:

First a warning:

jquery.min.js:2 jQuery.Deferred exception: b.size is not a function TypeError: b.size is not a function
    at new b (http://myompsite.com/js/pkp.min.js:47:536)
    at HTMLInputElement.<anonymous> (http://myompsite.com/js/pkp.min.js:49:241)
    at Function.each (http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js:2:2573)
    at w.fn.init.each (http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js:2:1240)
    at w.fn.init.a.fn.jLabel (http://myompsite.com/js/pkp.min.js:49:204)
    at a.pkp.controllers.AutocompleteHandler [as constructor] (http://myompsite.com/js/pkp.min.js:212:52)
    at a.pkp.classes.ObjectProxy.parent (http://myompsite.com/js/pkp.min.js:109:83)
    at new a (http://myompsite.com/js/pkp.min.js:107:469)
    at Function.a.pkp.classes.Helper.objectFactory (http://myompsite.com/js/pkp.min.js:106:259)
    at HTMLDivElement.<anonymous> (http://myompsite.com/js/pkp.min.js:443:273) undefined

and then an actual error:

jquery.min.js:2 Uncaught TypeError: b.size is not a function
    at new b (pkp.min.js:47)
    at HTMLInputElement.<anonymous> (pkp.min.js:49)
    at Function.each (jquery.min.js:2)
    at w.fn.init.each (jquery.min.js:2)
    at w.fn.init.a.fn.jLabel (pkp.min.js:49)
    at a.pkp.controllers.AutocompleteHandler [as constructor] (pkp.min.js:212)
    at a.pkp.classes.ObjectProxy.parent (pkp.min.js:109)
    at new a (pkp.min.js:107)
    at Function.a.pkp.classes.Helper.objectFactory (pkp.min.js:106)
    at HTMLDivElement.<anonymous> (pkp.min.js:443)

[ajnyga]

I can fix this by editing pkp.min.js line 47 changing 0==b.size() to simply 0==b.size
https://github.com/pkp/omp/blob/master/js/pkp.min.js#L47

However, I still get the [Object object] match when I search for a title, but can now choose the Test title and save the form successfully.

Not that size is deprecated and length should be used instead.

[NateWr]

Maybe related to #4208 or the jQuery upgrade in #3404.

[ajnyga]

I think size was removed in jquery 3, but I did try replacing it with length and got the same error. Maybe size is still redirecting calls to length, but length in 3.0 does not allow what size used to allow?

[ajnyga]

ah ok, so you can not call length like length(). Changing the values to just .length works, but [Object object] is still there.

[asmecher]

The root cause is the "jLabel" jQueryUI plugin, which is unmaintained and needs replacement/removal.

[asmecher]

The jLabel plugin was only used to provide a "Start Typing" label behind the text field for autocomplete inputs. Personally I don't think it added anything important so I flat-out removed it.

PRs:

• pkp/pkp-lib#4575 Remove label behind autocomplete input #4745
• pkp/pkp-lib#4575 Remove label behind autocomplete input ojs#2383

These can be cherry-picked back to stable-3_1_2 but they'll require a JS recompile if you're using minified JS.

@NateWr, any objections? Mind taking a quick look at the PRs? (Will port to OMP when it's ready -- but it's trivial, so no PR just yet.)

[NateWr]

No objections. PR looks good. 👍

[asmecher]

Merged and ported to stable-3_1_2 for OJS and OMP.