Skip to content

Commit

Permalink
fix(editor): Fix collection select label (no-changelog) (#7978)
Browse files Browse the repository at this point in the history
## Summary

before & after


![image](https://github.com/n8n-io/n8n/assets/8850410/9eef4b99-4cab-41de-ad82-7dadb653f307)

<img width="575" alt="image"
src="https://github.com/n8n-io/n8n/assets/8850410/e7d5ecd5-427e-4664-897f-5a42e68e3661">

#### How to test the change:
1. Add Pipedrive > Create Deal
2. Click on "Add Field" under "Additional Fields"
3. Options should be properly displayed (Title case)


## Issues fixed
https://linear.app/n8n/issue/NODE-977

## Review / Merge checklist
- [ ] PR title and summary are descriptive. **Remember, the title
automatically goes into the changelog. Use `(no-changelog)` otherwise.**
([conventions](https://github.com/n8n-io/n8n/blob/master/.github/pull_request_title_conventions.md))
- [ ] [Docs updated](https://github.com/n8n-io/n8n-docs) or follow-up
ticket created.
- [ ] Tests included.
> A bug is not considered fixed, unless a test is added to prevent it
from happening again. A feature is not complete without tests.
  >
> *(internal)* You can use Slack commands to trigger [e2e
tests](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#a39f9e5ba64a48b58a71d81c837e8227)
or [deploy test
instance](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#f6a177d32bde4b57ae2da0b8e454bfce)
or [deploy early access version on
Cloud](https://www.notion.so/n8n/Cloudbot-3dbe779836004972b7057bc989526998?pvs=4#fef2d36ab02247e1a0f65a74f6fb534e).
  • Loading branch information
elsmr authored Dec 11, 2023
1 parent 76ab411 commit 939e471
Show file tree
Hide file tree
Showing 2 changed files with 62 additions and 5 deletions.
18 changes: 13 additions & 5 deletions packages/editor-ui/src/components/CollectionParameter.vue
Original file line number Diff line number Diff line change
Expand Up @@ -36,12 +36,9 @@
<n8n-option
v-for="item in parameterOptions"
:key="item.name"
:label="
isNodePropertyCollection(item)
? i18n.nodeText().collectionOptionDisplayName(parameter, item, path)
: item.name
"
:label="getParameterOptionLabel(item)"
:value="item.name"
data-test-id="collection-parameter-option"
>
</n8n-option>
</n8n-select>
Expand Down Expand Up @@ -93,12 +90,23 @@ const getPlaceholderText = computed(() => {
i18n.baseText('collectionParameter.choose')
);
});
function isNodePropertyCollection(
object: INodePropertyOptions | INodeProperties | INodePropertyCollection,
): object is INodePropertyCollection {
return 'values' in object;
}
function getParameterOptionLabel(
item: INodePropertyOptions | INodeProperties | INodePropertyCollection,
): string {
if (isNodePropertyCollection(item)) {
return i18n.nodeText().collectionOptionDisplayName(props.parameter, item, props.path);
}
return 'displayName' in item ? item.displayName : item.name;
}
function displayNodeParameter(parameter: INodeProperties) {
if (parameter.displayOptions === undefined) {
// If it is not defined no need to do a proper check
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
import { createComponentRenderer } from '@/__tests__/render';
import { createTestingPinia } from '@pinia/testing';
import CollectionParameter from '../CollectionParameter.vue';

const renderComponent = createComponentRenderer(CollectionParameter, {
pinia: createTestingPinia(),
});

describe('CollectionParameter', () => {
afterEach(() => {
vi.clearAllMocks();
});

it('should render collection options correctly', async () => {
const { getAllByTestId } = renderComponent({
props: {
path: 'parameters.additionalFields',
parameter: {
displayName: 'Additional Fields',
name: 'additionalFields',
type: 'collection',
options: [
{
displayName: 'Currency',
name: 'currency',
type: 'string',
default: 'USD',
},
{
displayName: 'Value',
name: 'value',
type: 'number',
},
],
},
nodeValues: {
parameters: {
additionalFields: {},
},
},
},
});

const options = getAllByTestId('collection-parameter-option');
expect(options.length).toBe(2);
expect(options.at(0)).toHaveTextContent('Currency');
expect(options.at(1)).toHaveTextContent('Value');
});
});

0 comments on commit 939e471

Please sign in to comment.