Skip to content

Datepicker: Get selectedDay from data-date instead of element contents #1943

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

Merged
merged 1 commit into from
Jul 12, 2021

Conversation

c-lambert
Copy link
Contributor

selectDay() use jQuery html() method on td cell to get the day value from DOM, but when user use translator or other extension, it return NaN value because the cell can contains non excepted content. We must use data- attribute to ensure that value cannot be altered.

We got

<td class=" " data-handler="selectDay" data-event="click" data-month="0" data-year="2021">
    <a class="ui-state-default" href="#">
        <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">22</font></font>
    </a>
</td>

instead of

<td class=" " data-handler="selectDay" data-event="click" data-month="0" data-year="2021">
   <a class="ui-state-default" href="#">22</a>
</td>

so this cannot work correctly

 inst.selectedDay = inst.currentDay = $( "a", td ).html();

I think it's not a good practice to get value from html DOM element

Base automatically changed from master to main February 19, 2021 19:58
@mgol
Copy link
Member

mgol commented Apr 9, 2021

Thanks for the PR!

@fnagel Are you able to review this?

@mgol mgol requested a review from fnagel April 9, 2021 21:41
@fnagel fnagel requested review from arschmitz and mgol April 14, 2021 07:31
@fnagel
Copy link
Member

fnagel commented Apr 14, 2021

Looks like a replace of .html() to .text() would work too but using a data attribute feels more safe and sane.

@mgol What do you think?

@c-lambert Would you mind squashing the CGL fix commit into the actual one?

@c-lambert
Copy link
Contributor Author

Looks like a replace of .html() to .text() would work too but using a data attribute feels more safe and sane.

@mgol What do you think?

@c-lambert Would you mind squashing the CGL fix commit into the actual one?

Hello ! I think this is more safe too. data- attributes is indeed already used in the template for year and month data.

:1813

( unselectable ? "" : " data-handler='selectDay' data-event='click' data-month='" + printDate.getMonth() + "' data-year='" + printDate.getFullYear() + "'" ) + ">" + // actions

Copy link
Member

@mgol mgol left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@fnagel Data attributes make sense to me considering they're also used for year/month/etc. data. However, looking at the code, Datepicker reads the attributes directly via native getAttribute instead of using .data() which just pulls initial attribute value and then ignores subsequent changes to the attribute.

@c-lambert Such a change requires adding a unit test; you can look at the existing test files for similar data-*-related tests.

Copy link
Member

@fnagel fnagel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please change the commit title from "DatePicker: Get..." ti "Datepicker: Get...". Otherwise good to be merged IMO.

@mgol I think we can skip the tests here, as its actually a tiny change which should to be covered my existing tests.

@mgol
Copy link
Member

mgol commented May 12, 2021

@fnagel We don't have tests ensuring we don't read the element contents but I guess we also don't have such tests for other fields so I guess we're good here. I wouldn't block the RP over the title, I can fix that during the squash & merge. If that's your only concern, could you withdraw the objection? I'll be sure to modify the component during the merge.

Copy link
Member

@mgol mgol left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Withdrawing my objections per Felix's comment; LGTM.

@c-lambert c-lambert changed the title DatePicker: Get selectedDay by data instead DOM html Datepicker: Get selectedDay by data instead DOM html May 14, 2021
Copy link
Member

@mgol mgol left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I looked at the PR again & I have one important remark.

@@ -1036,7 +1036,7 @@ $.extend( Datepicker.prototype, {
}

inst = this._getInst( target[ 0 ] );
inst.selectedDay = inst.currentDay = $( "a", td ).html();
inst.selectedDay = inst.currentDay = $( "a", td ).data( "date" );
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, now that I look at it again, we should read the attribute directly instead of using data. .data(key) pulls the initial value from the data-key attribute but that's it; it then keeps its state and disregards the attribute. It sounds we want the attribute to be the soruce of truth here.

Most other similar places in this widget use +this.getAttribute( "data-something" ). I'm not sure if skipping jQuery's .attr() had any reason but we should either use getAttribute or attr here & cast the value to number.

@mgol
Copy link
Member

mgol commented Jul 6, 2021

@c-lambert Hey, do you want to try to update the PR with my feedback? If you don't have time, we may try to do it ourselves.

@c-lambert c-lambert force-pushed the c-lambert-patch-1 branch from 3321bd4 to 8663ef3 Compare July 6, 2021 12:47
@c-lambert
Copy link
Contributor Author

@c-lambert Hey, do you want to try to update the PR with my feedback? If you don't have time, we may try to do it ourselves.

Ok done ! I also parsed the return value of attr() method to int.

@mgol
Copy link
Member

mgol commented Jul 7, 2021

@c-lambert Thanks! Can you also rebase over latest main? The PR cannot be merged right now due to a conflict.

@mgol
Copy link
Member

mgol commented Jul 8, 2021

@c-lambert I see you upvoted my comment. Let me know when you rebase and I'll merge the PR. Thanks!

@c-lambert
Copy link
Contributor Author

@c-lambert I see you upvoted my comment. Let me know when you rebase and I'll merge the PR. Thanks!

I can do it this weekend !

@c-lambert c-lambert force-pushed the c-lambert-patch-1 branch from 8663ef3 to 2c79601 Compare July 12, 2021 07:31
@c-lambert c-lambert force-pushed the c-lambert-patch-1 branch from 2c79601 to 57624b0 Compare July 12, 2021 07:34
@c-lambert
Copy link
Contributor Author

@c-lambert I see you upvoted my comment. Let me know when you rebase and I'll merge the PR. Thanks!

Hello it's done !

@mgol mgol changed the title Datepicker: Get selectedDay by data instead DOM html Datepicker: Get selectedDay from data-date instead of element contents Jul 12, 2021
@mgol mgol merged commit cf938e2 into jquery:main Jul 12, 2021
@mgol mgol added this to the 1.13 milestone Jul 12, 2021
@mgol
Copy link
Member

mgol commented Jul 12, 2021

Landed, thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

4 participants