mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-15 01:03:03 +08:00
fix(label): do not grow when in end slot (#29036)
Issue number: resolves #29033 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> In https://github.com/ionic-team/ionic-framework/pull/28773 I resolved several incorrect behaviors with Items related to text wrapping. However, it looks like I missed the removal of https://github.com/ionic-team/ionic-framework/pull/28146/files#diff-4a1156704dbf45b0dad273b6909b190ca45e4380aa7378ba88d0dd7d48d7d473R37 which caused the issue to persist when adding a label to the end slot. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Removed logic that caused `ion-label` to grow larger than it needed to be | `main` | branch | | - | - | |  |  | ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.7.2-dev.11707840956.16e27b4c` --------- Co-authored-by: ionitron <hi@ionicframework.com>
This commit is contained in:
@ -29,14 +29,6 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// TODO(FW-5289): move to :host-context(.item)
|
||||
// Shouldn't need :not(.item-input) as this was
|
||||
// only needed because of the specificity with
|
||||
// :not(.item-legacy)
|
||||
:host-context(.item:not(.item-input):not(.item-legacy)) {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
:host(.ion-color) {
|
||||
color: current-color(base);
|
||||
}
|
||||
|
27
core/src/components/label/test/item/item.e2e.ts
Normal file
27
core/src/components/label/test/item/item.e2e.ts
Normal file
@ -0,0 +1,27 @@
|
||||
import { expect } from '@playwright/test';
|
||||
import { configs, test } from '@utils/test/playwright';
|
||||
|
||||
configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
test.describe(title('label: in item'), () => {
|
||||
test('should render correctly in an item', async ({ page }) => {
|
||||
test.info().annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/29033',
|
||||
});
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-item>
|
||||
<ion-label slot="start">Start</ion-label>
|
||||
<ion-label>Default</ion-label>
|
||||
<ion-label slot="end">End</ion-label>
|
||||
</ion-item>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const item = page.locator('ion-item');
|
||||
|
||||
await expect(item).toHaveScreenshot(screenshot(`label-item`));
|
||||
});
|
||||
});
|
||||
});
|
Binary file not shown.
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.1 KiB |
Reference in New Issue
Block a user