Skip to content

fix(material-experimental/mdc-table): error when flexbox-based table is initialized #21428

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
Jan 6, 2021

Conversation

crisbeto
Copy link
Member

The MDC-based table tries to add a class to its internal tbody element and it assumes that it's always going to find it. The assumption used to be correct since we only supported native table elements for the MDC implementation, however as of #20994 we also support flexbox-based ones which throw an error, because they don't have a tbody.

These changes add a check to prevent the error and include a couple of sanity tests to catch issues like this in the future.

I've also reworked the tests so that they use the MDC-based MatPaginator and MatTableDataSource, instead of the base ones.

…is initialized

The MDC-based table tries to add a class to its internal `tbody` element and it assumes
that it's always going to find it. The assumption used to be correct since we only
supported native `table` elements for the MDC implementation, however as of angular#20994
we also support flexbox-based ones which throw an error, because they don't have a
`tbody`.

These changes add a check to prevent the error and include a couple of sanity tests to
catch issues like this in the future.

I've also reworked the tests so that they use the MDC-based `MatPaginator` and
`MatTableDataSource`, instead of the base ones.
@crisbeto crisbeto added P2 The issue is important to a large percentage of users, with a workaround target: patch This PR is targeted for the next patch release labels Dec 23, 2020
@google-cla google-cla bot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Dec 23, 2020
"@npm//@angular/platform-browser",
"@npm//rxjs",
],
)

ng_web_test_suite(
name = "unit_tests",
static_files = ["@npm//:node_modules/@material/data-table/dist/mdc.dataTable.js"],
static_files = [
Copy link
Contributor

Choose a reason for hiding this comment

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

why do the new tests need these?

Copy link
Member Author

Choose a reason for hiding this comment

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

Because the tests now use the MDC-based paginator which has an internal form field and button. These are the MDC js files that they depend on.

@annieyw annieyw added the action: merge The PR is ready for merge by the caretaker label Dec 29, 2020
@annieyw annieyw merged commit 2255b66 into angular:master Jan 6, 2021
annieyw pushed a commit that referenced this pull request Jan 6, 2021
…is initialized (#21428)

The MDC-based table tries to add a class to its internal `tbody` element and it assumes
that it's always going to find it. The assumption used to be correct since we only
supported native `table` elements for the MDC implementation, however as of #20994
we also support flexbox-based ones which throw an error, because they don't have a
`tbody`.

These changes add a check to prevent the error and include a couple of sanity tests to
catch issues like this in the future.

I've also reworked the tests so that they use the MDC-based `MatPaginator` and
`MatTableDataSource`, instead of the base ones.

(cherry picked from commit 2255b66)
mmalerba added a commit to mmalerba/components that referenced this pull request Jan 12, 2021
mmalerba added a commit to mmalerba/components that referenced this pull request Jan 12, 2021
mmalerba added a commit that referenced this pull request Jan 12, 2021
…d table is initialized (#21428)" (#21568)

* Revert "fix(material-experimental/mdc-table): error when flexbox-based table is initialized (#21428)"

This reverts commit aade5d1.

* fixup! Revert "fix(material-experimental/mdc-table): error when flexbox-based table is initialized (#21428)"
wagnermaciel pushed a commit to wagnermaciel/components that referenced this pull request Jan 14, 2021
…is initialized (angular#21428)

The MDC-based table tries to add a class to its internal `tbody` element and it assumes
that it's always going to find it. The assumption used to be correct since we only
supported native `table` elements for the MDC implementation, however as of angular#20994
we also support flexbox-based ones which throw an error, because they don't have a
`tbody`.

These changes add a check to prevent the error and include a couple of sanity tests to
catch issues like this in the future.

I've also reworked the tests so that they use the MDC-based `MatPaginator` and
`MatTableDataSource`, instead of the base ones.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Feb 6, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement P2 The issue is important to a large percentage of users, with a workaround target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants