telerik / kendo-vue Goto Github PK

I'm submitting a...

• Regression report

Current behavior

kendo[d]Classes typo in the Base component results in an error when changing model value.

Expected behavior

No error should be thrown

Minimal reproduction of the problem with instructions

Could be observed in the following StackBlitz: https://stackblitz.com/edit/q7wsg9?file=index.html. Simply select a value in the DatePicker

Browser:
all

Currently, there are circular references that prevent building and running a Vue app with rollup configuration.

my-project.zip

Grid filter row is not locked.

If the Grid has locked columns the filter row is not locked:
https://stackblitz.com/edit/8rujf7?file=index.html

I'm submitting a...

• Bug report

Current behavior

https://stackblitz.com/edit/azp3yx-css4wx?file=index.js
1 - open your stackblitz

2 - make the html page inside the stackblitz smaller

3 - see that the columns are smaller than the minResizableWidth prop
additional information:
4 - resize one of the grid columns (like you did in your video)

5 - resize the window again (like I described in my example)

6 - ...all the columns are rendered as expected also in a small screen, apparently using the minResizableWidth prop correctly.

Expected behavior

1 - open your last stackblitz

2 - make the html page inside the stackblitz smaller

3 - the columns are persisting their width

I'm submitting an enhancement

Implement grouping virtualization

I'm submitting a...

• Bug report

Current behavior

When there is a custom cell template applied to a column in the Grid(Native), using the grouping functionality breaks Grid's layout

Expected behavior

The Grid's layout shouldn't be affected if we apply a custom cell template

Minimal reproduction of the problem with instructions

1. Open this StackBlitz project
2. See that the values in the ProductName column are bolded, but Grid's layout is broken
3. Remove the cell template definition on line 54 by removing the cell property.
4. Run the project again and see how if we don't apply a cell template, Grid's layout is being displayed correctly

Environment

Package versions:

2019.2.621

Browser:
All

Slot template is not rendered in a specific project.

cellcolumn.zip
install globally - @vue/cli-service-global
npm install && vue serve

Add column virtualization.

Bug report

Reproduction of the problem

Tooltip Vue Wrapper does not support native template for content prop

ticket: 1443388

Environment

• **Kendo UI version:2019.3.1023

I'm submitting a...

• Bug report

Current behavior

Go to
https://www.telerik.com/kendo-vue-ui/components/grid-native/filtering/
clear the filter and try to filter the date to is equal to 8/12/1996
No item in the Grid items

Expected behavior

One item is visible in the Grid items

I'm submitting a...

• Suggestion for improvement
• Documentation issue or request

Current behavior

When installing, some packages require a version of vue-class-component ^6.3.2 as a peer dependency

Expected behavior

Either explicitly state somewhere in the docs that the package requires vue-class-component ^6.3.2, or better yet, support >= 6.3.2 (so including 7+)

What is the motivation or use case for changing the behavior?

So that users of vue-class-component version 7+ do not have to worry about possible issues, and to get rid of a warning.
Other dependencies may require a different version and have an actual need for it.
Also, it doesn't look like there are any breaking changes in vue-class-component despite the bump to the major version.

Environment

Package versions:

    "@progress/kendo-data-query": "^1.5.2",
    "@progress/kendo-theme-default": "^4.10.0",
    "@progress/kendo-vue-animation": "^0.3.7",
    "@progress/kendo-vue-excel-export": "^0.3.7",
    "@progress/kendo-vue-grid": "^0.3.7",
    "@progress/kendo-vue-intl": "^0.3.7",
    "@progress/kendo-vue-popup": "^0.3.7",
    "vue": "^2.6.11",
    "vue-class-component": "^7.1.0",

Browser:
not applicable

System:

• TypeScript version: 3.7.3 (same while in 3.5)
• Node version: 12.13.1
• Platform: Windows

Scenario

For instance, I have a column with names, I want to filter by a specific name, so I will create a custom filter component (I know how to create that), and I want to provide the list of names available for that column. I have checked and ColumMenu provides default props, but what about a custom prop to get a filter options list?

ticket: 1444339

Something similar to what already exists in React with GridColumnMenuCheckboxFilterProps
https://www.telerik.com/kendo-react-ui/components/grid/api/GridColumnMenuCheckboxFilterProps/

I'm submitting a Bug report

Current behavior

When attempting to use the kendo-vue-grid with minimal dependencies, after following the Webpack installation instructions on the Telerik website and attempting to run the project, a number of error messages regarding missing dependencies is displayed:

These dependencies were not found:

* @progress/kendo-data-query in ./node_modules/@progress/kendo-vue-grid/dist/es/columnMenu/GridColumnMenuFilter.js
* @progress/kendo-vue-animation in ./node_modules/@progress/kendo-vue-grid/dist/es/columnMenu/GridColumnMenuItemContent.js
* @progress/kendo-vue-intl in ./node_modules/@progress/kendo-vue-grid/dist/es/GridNoRecords.js, ./node_modules/@progress/kendo-vue-grid/dist/es/cells/GridEditCell.js and 8
others
* @progress/kendo-vue-popup in ./node_modules/@progress/kendo-vue-grid/dist/es/columnMenu/ColumnMenu.js
* vue-class-component in ./node_modules/@progress/kendo-vue-grid/dist/es/GridToolbar.js, ./node_modules/@progress/kendo-vue-grid/dist/es/Grid.js and 32 others

Expected behavior

Either the grid component should run correctly after installing the two dependencies listed on the website (@progress/kendo-theme-default and @progress/kendo-vue-grid) or the documentation should have the correct installation instructions listing all necessary steps.

Minimal reproduction of the problem with instructions

1. In a fresh Vue project with no kendo dependencies, follow the official instructions to install the two listed npm dependencies.
2. Register the Grid component as described on that page.
3. Try to compile and run the solution.
   I was unable to reproduce this issue on StackBlitz which seems to force peer dependencies to be installed. However I have reproduced this on CodeSandbox.

What is the motivation or use case for changing the behavior?

It should be easy to get started by following the official instructions.

Environment

Package versions:

@progress/[email protected]
@progress/[email protected]
[email protected]

System:

• Node version: 10.16.0
• npm version: 6.9.0
• Platform: Windows

I'm submitting a...

• Bug report

Current behavior

Locked columns are not working in IE11 - https://www.telerik.com/kendo-vue-ui/components/grid-native/columns/locked/

Misalignment when column virtualization and multi-header column is used. The issue can be observed in the following https://stackblitz.com/edit/gys5r9-gzawwv?file=index.js example.

Scroll to the right and notice that record R1:C33 is under header Field-34.

The expected behavior is that R1:C34 to be under Field-34.

I'm submitting a...

• Bug report

Current behavior

Extra header element is rendered when :scrollable="'none'"
https://stackblitz.com/edit/bhsxzs-tdsukc?file=index.html

Expected behavior

There should be no extra header element is rendered when :scrollable="'none'"

I'm submitting a enhancement

Current behavior

PDF Grid export depends on @progress/kendo-vue-grid

Expected behavior

PDF Grid export doesn't depend on @progress/kendo-vue-grid

We should retest our PDF examples after this update

Add possibility to export to PDF even when in templates are used other custom libraries

Current behavior

https://stackblitz.com/edit/pawz5g?file=index.js
press export
js error is observed

Expected behavior

no js error

I'm submitting a...Bug report

or Suggestion for improvement

add detailRowHeight prop into Native grid
to fix virtual scrolling with expanded detail row

https://www.telerik.com/kendo-vue-ui/components/grid-native/api/GridProps/

Current behavior is same as in this bug

telerik/kendo-angular#2430
telerik/kendo-angular#35

Expected behavior

nice and smooth scrolling

Minimal reproduction of the problem with instructions

enable virtual scrolling with server side paging
and put bunch of items into details row to increase it's height

What is the motivation or use case for changing the behavior?

motivation - irritation of bad UX when grid does not scroll

Environment

Package versions: @latest,

Browser: Chrome (desktop) version @latest,

System: Windows 10, Node version @latest

I'm submitting a bug report

Current behavior

https://stackblitz.com/edit/gngxxy?file=index.html
2 columns are generated

Expected behavior

3 columns are generated

I'm submitting a...

• Bug report

Current behavior

When adding a row to a grid that currently has a column sorted, once data is entered in the new record (sorted column) the grid is resorted mid edit.

Expected behavior

Grid should not resort until the save button is pressed. Or not at all.

Minimal reproduction of the problem with instructions

https://jcevsc.stackblitz.io/

in the above link, press the "Add New" button.
in the name field type "z", then press tab.

you will notice the grid resort.

What is the motivation or use case for changing the behavior?

Environment

Package versions:

Browser:

• Chrome (desktop) version 72

System:

• TypeScript version: XX
• Node version: XX
• Platform:

The slot syntax was updated in the latest Vue version so we should update our demos - Here is a reference for this change - https://vuejs.org/v2/guide/components-slots.html#Deprecated-Syntax.

As there is no way to hide a column in the Kendo Vue Native Grid, there is no way to set the title of the grouping-property, if it isnt displayed in the grid:

https://stackblitz.com/edit/rvzzgi

The grouping on the property "UnitsInStockUglyString" works as expected, but ther is no way to set the text of the grouping header.

idea:
Add an optional property "title" to the GroupDescriptor-Property:

        group: [ { field: 'UnitsInStockUglyString' , title: 'My beautiful grouped text' } ],

This would also help on non-hidden fields, as it gives us the option to assign texts other than the column name.

I'm submitting a...

• Bug report

Current behavior

https://stackblitz.com/edit/5nrvff-q8yx6q?file=index.js
The row that starts with 'Chang' contains k-alt class and appears darker instead light

Expected behavior

The row that starts with 'Chang' does not contain k-alt class and appears light

I'm submitting a...

• Bug report

Current behavior

When defining a custom cell template by defining a new Vue component few Vue warnings appear in the console. Here are the errors:

• [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "dataItem"
• [Vue warn]: $listeners is read-only.

Expected behavior

There should be any errors in the console when defining a cell template using a Vue component.

Minimal reproduction of the problem with instructions

1. Open this Dojo example
2. Sort the Grid by any column
3. See the browser's console

Environment

Package versions: kendo-vue-grid 0.3.7 loaded via CDN

The issue is observed when a template that relies on the $store is exported to pdf.

Project in ticket: 1405494

I'm submitting an enhancement.

Add frozen columns to Grid

Add Column Menu functionality

I'm submitting a...

• Bug report

Current behavior

https://stackblitz.com/edit/eqof1c?file=index.js
1.Click on the UnitPrice to sort the column
Grid is sorted
2. Click on the ProductID header that is sortable false
Result:
It changes the sorting

Expected behavior

It is not changing the sorting

I'm submitting a...

• Bug report

Current behavior

The native Vue Grid "no records" entry spans only over the width of the first column:
https://stackblitz.com/edit/gtqd9r-2i5ldt?file=index.html

Expected behavior

The "no records" should span over all columns.

Minimal reproduction of the problem with instructions

Run the following sample: https://stackblitz.com/edit/gtqd9r-2i5ldt?file=index.html

Environment

Package versions:
kendo-vue-grid 0.3.4

Browser:
all

RowClick event is not triggered, when a CellTemplate is used and the click is performed on cell content.

https://stackblitz.com/edit/mdabmt-9mk7b4?file=index.js

Workaround

Instead of handling rowClick event, you can emit a custom click from the Cell Template. Hence, you will ensure that the event is always triggered:

https://stackblitz.com/edit/mdabmt-9mk7b4?file=index.js

https://stackblitz.com/edit/spkewp-3mtzkj?file=index.js

Steps to replicate:
try to filter the first column

Current behavior -
JS error - TypeError: (e || "").indexOf is not a function

Expected behavior

No error and the filtering is performed

The issue seems to be coming from the @progress/kendo-data-query code

Minimal reproduction of the problem with instructions

1. Open the following sample : https://stackblitz.com/run?embed=1&file=index.js or https://www.telerik.com/kendo-vue-ui/components/grid-native/filtering/
2. Apply "In Null" filter to the first column

Current behavior

The following error is thrown:
[Vue warn]: Error in render: "TypeError: l is not a function"

Environment

Package versions:
"@progress/kendo-vue-grid": "0.2.1",
"@progress/kendo-data-query": "1.5.0"

I'm submitting a...

• Bug report

Current behavior

Kendo Vue Grid (native) throws an error whenever you type a character into any of the column filters.

• Possible workaround is discussed on this link: https://stackoverflow.com/questions/58479630/telerik-vuejs-grid-filtering-throwing-error/58548694#58548694

Expected behavior

The Grid data should be filtered like it could be seen in this StackBlitz project: https://stackblitz.com/edit/hqoco4?file=package.json

Minimal reproduction of the problem with instructions

Steps to reproduce:

1. Open this demo: https://www.telerik.com/kendo-vue-ui/components/grid-native/filtering/
2. Try to filter the Grid data by entering a value in the filters above each of the columns

The following error will appear in the console:
RangeError: Invalid array length at s (kendo-vue-grid.js:22) at a.e.setFilter (kendo-vue-grid.js:22) at change (kendo-vue-grid.js:22) at Bt (kendo-vue-grid.js:17) at a.n (kendo-vue-grid.js:17) at Bt (kendo-vue-grid.js:17) at a.t.$emit (kendo-vue-grid.js:17) at a.e.triggerChange (kendo-vue-grid.js:17) at a.e.inputChange (kendo-vue-grid.js:17) at input (kendo-vue-grid.js:17)

What is the motivation or use case for changing the behavior?

Regression bug

Environment

Package versions:
@progress/kendo-vue-grid": "0.3.6"

Browser:
All

Minimal reproduction of the problem with instructions

1. Open the following demo: https://www.telerik.com/kendo-vue-ui/components/grid-native/filtering/#toc-filter-row
2. Clear the value from the "First Ordered On" column using the 'x' icon inside the input

Current behavior

The value is cleared and the following error is thrown:
RangeError: Invalid time value

Expected behavior

The value is cleared and no error is thrown

Environment

Package versions:
"@progress/kendo-vue-grid": "0.2.1-dev.201902210910",

I'm submitting a...

• Regression report

Current behavior

Native Grid renders <a> tag in its header even if the column is not sortable. That would result in a cursor pointer to be displayed when hovering over the header.

This is a regression introduced with the 2019.2.621 release

Expected behavior

<a> tag should not be present when the column is not sortable.

Minimal reproduction of the problem with instructions

Take a look at the overview's basic usage example here https://www.telerik.com/kendo-vue-ui/components/grid-native/

Environment

Package versions:
2019.2.621

Browser:
all

I'm submitting a...

• Bug report

Current behavior

Group header template displays "undefined" when grouped by Date field
For reference run the following StackBlitz: https://stackblitz.com/edit/4hwtep?file=index.js

Expected behavior

Group header template should properly render the Date as a string

Minimal reproduction of the problem with instructions

For reference run the following StackBlitz: https://stackblitz.com/edit/4hwtep?file=index.js

Browser:

• all

We need events that could be triggered from the template and handled form the component as in this scenario - https://stackblitz.com/edit/5dqzid-ktee3g?file=index.js

In our to add such possibility we will add 'change' events that will be able to be triggered with an argument form the template

Allow local components as templates

Currently we only allow to add them as global components - Vue.component("template-component", { a.. as shown here - https://www.telerik.com/kendo-vue-ui/components/grid-native/custom-rendering/custom-cells/#toc-customization-approaches

We should allow passing only local object that is not registered globally

I'm submitting a...

• Bug report

Current behavior

Although skip is bound to a nonzero starting value, scrolling behaves as if skip were set to zero. The scroll position is at the top of the container and scrolling down produces pageChange events with skip values starting at 1.

Expected behavior

The initial scroll position should correspond to the value assigned to the skip prop and pageChange events should match this scroll position.

Minimal reproduction of the problem with instructions

https://stackblitz.com/edit/mshomu?file=index.js

What is the motivation or use case for changing the behavior?

We have a scenario where setting the initial scroll position in the grid is required.

Browser:

• Chrome (desktop) version 73
• Firefox version 66

System:

• Platform: Mac, Windows

I'm submitting a...

• Bug report

Current behavior

Virtual scrolling is not smooth with 500000 items.

Expected behavior

Virtual scrolling should be smooth with 500000 items.

The issue could be observed in this example when we scroll left - https://stackblitz.com/edit/bright-column-virtualization-demo-sg4eqa?file=index.html

Expected - the locked columns don't move when we scroll left.

Minimal reproduction of the problem with instructions

1. Open the following sample : https://stackblitz.com/edit/zvhr6x?file=index.js
2. Apply "Containg", "Doesn not contain", "Starts with" or "Ends with" filter to the first column

Current behavior

The following error is thrown:
[Vue warn]: Error in render: "TypeError: (e || "").indexOf is not a function"

Not reproducible with React: https://8hr57t.run.stackblitz.io

Environment

Package versions:
"@progress/kendo-vue-grid": "0.2.1-dev.201902210910",
"@progress/kendo-data-query": "1.5.1-dev.201903010610"

I'm submitting a...

• Bug report

Current behavior

When scrolling to the bottom of a grid where the columns are wider than the grid container, extra whitespace appears below the grid rows and the scrollbar may behave strangely.

Expected behavior

No whitespace appears below the rows and scrolling behaves as normal.

Minimal reproduction of the problem with instructions

https://stackblitz.com/edit/fcsuzv?file=index.js

Scroll to the bottom of the list.

What is the motivation or use case for changing the behavior?

The user experience when working with the grid is negatively impacted.

Environment

Browser:

• Chrome (desktop) version 73

System:

• Platform: Mac, Windows

I'm submitting a...

• Suggestion for improvement

Current behavior

When the Native Grid columns has cell and headerCell customization through functional components, the allocated memory by the Grid is not being disposed when switching between Vue router views.

Expected behavior

The allocated memory should be correctly disposed when working with functional components.

Minimal reproduction of the problem with instructions

_kendo-grid-memory-test.zip

• Start the app
• Open Chrome 'Memory' tab in DevTools
• Switch between the two routes from the links above the Grid and observe the memory stack.

Environment

Package versions: kendo-vue-grid 0.3.4

I'm submitting a...

• Bug report

Current behavior

When trying to filter grid rows by a single column filter which uses "or" logic, rows are not filtered properly and Error: Cannot read property 'concat' of undefined is seen in the console.

Expected behavior

Rows are filtered properly.

Minimal reproduction of the problem with instructions

See the following Stackblitz: https://stackblitz.com/edit/vzmfzp?file=index.js

Steps to reproduce

1. Try to set filter on Name column: contains "cha" OR contains "grandma"
2. Check out the console

In the Stackblitz above I inserted console.log(event.data.filter); inside dataStateChange function. There you can clearly see that logic is undefined for the filter, although it should be set to or:

Environment

Package versions:
See package.json in Stackblitz

Browser:

• Chrome (desktop) Version 76.0.3809.100 (Official Build) (64-bit)

System:

• Platform: Ubuntu 18.04

I'm submitting a...

• Bug report

Current behavior

A wrapper element is added when the values of the component are changed by a computed value.

Expected behavior

No wrapper element is added.

Minimal reproduction of the problem with instructions

https://stackblitz.com/edit/fxhflu?file=index.html
Just click the change button a couple of times.

I'm trying to get data from json array to kendo-dropdowntree, fiddle is here: http://plnkr.co/edit/GRuLfHLgdlMV2qP7Xafn?p=preview
DatePicker is working but i need dropdowntree.
Thanks in advance.

I'm submitting a...

• Question

Current behavior

I'm trying to add more strict CSP rules to my app and we use the Grid component. One of the dependencies is the @progress/kendo-vue-popup package and it's raising unsafe-inline errors (there are some methods in the package that manually set the style of the elements).

Do you have plans to make the Kendo Vue library CSP strict compatible?

Expected behavior

The components work with strict CSP rules.

What is the motivation or use case for changing the behavior?

I want to use strict CSP rules for the script and styles.

Environment

Package versions:

+-- @progress/[email protected]
+-- @progress/[email protected]
+-- @progress/[email protected]
+-- @progress/[email protected]
+-- @progress/[email protected]
+-- @progress/[email protected]
+-- @vue/[email protected]
+-- @vue/[email protected]
`-- [email protected]

System:

• Node version: v12.13.1
• Platform: Windows

Minimal reproduction of the problem with instructions

1. git clone https://github.com/fabiano/kendo-vue-grid-csp
2. cd kendo-vue-grid-csp
3. npm install
4. npm start
5. Open the Developer Tools and you will see the error message: Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-Y+wsDhnso/VitFKVAmAGIC+CGwKJuRUiycQ54atO+eE='), or a nonce ('nonce-...') is required to enable inline execution.

I'm submitting a...

• Bug report

Current behavior

https://stackblitz.com/edit/mfw65t-pnycmg?file=package.json
click on export
Error : Cannot read property 'data' of undefined

Expected behavior

No Error