Skip to content

Commit

Permalink
Updated to Angular 19 (issue angular-slider#389)
Browse files Browse the repository at this point in the history
  • Loading branch information
vinlos committed Jan 20, 2025
1 parent e6cd2c4 commit b953bd0
Show file tree
Hide file tree
Showing 65 changed files with 6,837 additions and 5,784 deletions.
96 changes: 51 additions & 45 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,177 +1,183 @@
# 18.0.0
# Changelog

## 19.0.0
* add support for Angular 19 (issue #389)
* fixed a few typos and heading in *.md files

## 18.0.0
* add support for Angular 18 (issue #379)

# 17.0.2
## 17.0.2
* fix bad performance with large ceil values (issue #366)

# 17.0.1
## 17.0.1
* replace expired Discord link in README

# 17.0.0
## 17.0.0
* added support for Angular 17
* added new 'AllowUnsafeHtmlInSlider' option
* fix misalignment in horizontal slider due to improper scss code (#356)
* export SliderComponent in public API (#294)
* fix minor typo in STYLING.md (#331)

# 16.0.1
## 16.0.1
* fix bad performance with large ceil values (issue #366)

# 16.0.0
## 16.0.0
* backport created from 17.0.1 targeting Angular 16

# 15.0.1
## 15.0.1
* fix bad performance with large ceil values (issue #366)

# 15.0.0
## 15.0.0
* backport created from 17.0.1 targeting Angular 15

# 14.0.0
## 14.0.0
* backport created from 17.0.1 targeting Angular 14

# 13.0.0
## 13.0.0
* backport created from 17.0.1 targeting Angular 13

# 2.0.4
## 2.0.4
* apply changes only when options object really changes
* remove throttling options (#282, #283)
* add option to set slider rotation (#232)
* expose getStepLegend to show a custom object when we have stepsArray (#302)
* update detect-passive-events to v2 (#244)
* update accessibility options (#273)

# 2.0.3
## 2.0.3
* apply with-legend class to the slider element (issue #170)
* fix counting number of ticks to create with non-integer divisions and access legend from stepArray in safe way (issue #222)
* fix changing disabled/read-only slider dynamically (issue #220)

# 2.0.2
## 2.0.2
* fix Angular version reference in NPM package (issue #219)

# 2.0.1
## 2.0.1
* disable animation on moving slider by default (issue #114)
* fix dragging slider while setting options dynamically (#111)
* fix displaying ticks if using decimal step values and make tickValueStep option more intuitive to use (issue #128)
* fix input normalisation when using stepsArray (issue #137)
* always set aria orientation for min slider pointer (issue #163)

# 2.0.0
## 2.0.0
* update to use rxjs >=6, targeting Angular >=6
* re-brand to ngx-slider
* publish under new NPM namespace @angular-slider/npx-slider

# 1.2.6
## 1.2.6
* re-publish with correct README.md, LICENSE.md and scss files
* fix build script to avoid publishing mistakes in the future
* document available keyboard shortcuts in README.md (issue #218)

# 1.2.5
## 1.2.5
* fix rxjs imports to work correctly with Angular 9+ (issues #181 and #197)
* fix ngOnDestroy throwing an exception (issue #215)
* fix "Attempt to use a destroyed view" error on Angular 8+ (issue #140)
* allow slider to be used with OnPush change detection strategy (issue #158)
* remove unnecessary packages from package.json (issue #113)
* update some outdated dependencies as reported by dependabot

# 1.2.4
## 1.2.4
* fix bug with setting vertical state on slider initialisation

# 1.2.3
## 1.2.3
* fix visibility of high slider pointer in case of inherited CSS style

# 1.2.2
## 1.2.2
* fix detecting nearest slider handle when clicking on slider bar (issue #110)
* finish refactoring legacy slider code to modern Angular 2+ style

# 1.2.1
## 1.2.1
* fix erratic slider behaviour when using simple slider with ticksArray
* fix tick parameters not getting updated correctly (issue #105 and #89)
* fix not getting highValue in userChange events (issue #108)
* fix slider not getting refreshed after visibility change - see notes in KNOWN_ISSUES.md (issue #106)

# 1.2.0
## 1.2.0
* add CSS animations ported from angularjs-slider (issue #72)
* re-write model update code with rxjs, fixing a number of bugs in this area (issue #69, #86, #91, #93, #95)
* fix behaviour of draggable range when moving it with mouse (issue #80)
* fix prepare script on non-Unix platforms (issue #103)

# 1.1.14
## 1.1.14
* add ability to set focus programmatically (issue #64)
* clarify interaction of stepsArray with other options (issue #60)
* document known issues in README
* remove obsolete enforceRange option
* remove some redudant refresh and change callbacks

# 1.1.13
## 1.1.13
* fix regression when updating model values through reactive forms (issues #61, #62)

# 1.1.12
## 1.1.12
* fix regression caused by applying model value and options changes in the wrong order when both change at the same time (issue #56)
* allow dynamic HTML in ticks legend (issue #49)
* improve rendering performance of simple sliders (PR #59)

# 1.1.11
## 1.1.11
* don't normalise values when stepsArray option is used (issue #52)

# 1.1.10
## 1.1.10
* always convert input values to numbers
* make sure range invariant is always satisfied (issue #48 follow-up)

# 1.1.9
## 1.1.9
* make sure model values are always in allowed range (issue #48)

# 1.1.8
## 1.1.8
* fix broken link in README (PR #44)
* add documentation for changing options object dynamically
* adjust layout of API documentation page on mobile

# 1.1.7
## 1.1.7
* add support for Angular reactive forms (issue #24)
* fix Angular peer dependency (issue #39)
* add CSS styling guide
* embed API documentation in demo app

# 1.1.6
## 1.1.6
* fix event handling when clicking on tick value (issue #36)
* fix warnings about event listener violation (issue #22)
* new layout of demo app

# 1.1.5
## 1.1.5
* fix event handling when touching exactly the tick element (issue #32)
* update model value if value is not initially in steps array (issue #35)
* added more e2e tests

# 1.1.4
## 1.1.4
* fixed slider jumping to first value if value is not in steps array (issue #29)
* fixed floating-point rounding in slider value calculations (issue #25)
* exposed SCSS files in distribution package (PR #28)

# 1.1.3
## 1.1.3
* changed initialization code to fix issue with slider shown dynamically through CSS animations (issue #16)

# 1.1.2
## 1.1.2
* added manual refresh mechanism to the slider (issue #15)

# 1.1.1
## 1.1.1
* fixed AOT compilation bug (issue #13)
* added support for user-initiated events (issue #9)
* minor demo app changes

# 1.1.0
## 1.1.0
* removed dependency on ng-bootstrap, providing an HTML standard or user-customisable way of rendering tooltips (issue #7)

# 1.0.1
## 1.0.1
* moved repository to official angular-slider organisation
* updated demo app to run under older browsers

# 1.0.0
## 1.0.0
* fixed error related to TouchEvent constructor on Firefox and Safari (issue #4)
* downgraded Angular and ng-bootstrap dependency versions to the minimum required (v5.0.2 and v1.0.0 respectively)
* fixed errors when using slider component without ng-bootstrap installed
* added e2e tests for slider component
* added Travis CI integration

# 0.4.0
## 0.4.0
* refactored demo app to show the examples with code snippets
* reverted view encapsulation of slider component to Angular defaults
* removed duplication in package.json and README.md between the main project and the NPM library
Expand All @@ -180,18 +186,18 @@
* added scripts to publish demo app and API documentation to Github Pages
* updated README.md and added DEVELOPERS.md

# 0.3.2
## 0.3.2
* add Plunker example to README

# 0.3.1
## 0.3.1
* add README.md and LICENSE to NPM package

# 0.3.0
## 0.3.0
* re-brand to ng5-slider as the target Angular version is 5+
* create and release NPM package


# 0.2.0
## 0.2.0
* add more examples of usage
* fix slider behaviour where it was broken in the examples
* change slider options following refactoring and code design considerations
Expand All @@ -201,7 +207,7 @@
- rename some cryptic variables and functions to more descriptive names
- start adding Angular bindings for CSS styles currently managed by JqLiteWrapper

# 0.1.0
## 0.1.0

* rough rewrite of original code into Angular 2
- copy-paste of the original JS code
Expand Down
35 changes: 21 additions & 14 deletions DEVELOPERS.md
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
# Contributing to ngx-slider

# Structure
## Structure

The repository is set up as an Angular project generated using ng-cli, which contains both the slider component, and a demo app.

The slider library is exported to an NPM package using [ng-packagr](https://github.com/dherges/ng-packagr), while the demo app is built and published to Github Pages.

The project relies on some auto-generated code using a number of scripts in `scripts/` directory. To ensure that everything works as expected, you should always use `npm run` commands as described below. Using `ng` commands directly might not always work.

# Building the library
## Building the library

To build the ngx-slider library (NPM package), use:
```
Expand All @@ -17,83 +17,90 @@ npm run build:lib

The ngx-slider NPM package files will be generated in `dist/` folder.

# Running the demo app
## Running the demo app

To build and run the demo app, use:

```
npm run start
```

The demo app should build and start on default URL `http://localhost:4200`.

# Running tests
## Running tests

## Unit tests
### Unit tests

There are a number of unit tests under `src/ngx-slider/` written in standard Angular convention using jasmine framework. To run them, use:

```
npm run test
```

Note: Currently (v1.2.1) most functionality is tested with end-to-end tests. This is not ideal for development, as running through the whole suite takes quite a long time. The plan for the future is to add more unit tests, so that development is easier.

## End-to-end (e2e) tests
### End-to-end (e2e) tests

End-to-end tests are inside `e2e/` folder and are written using playwright framework. When setting up for the first time, you may need to install additional browser executables that playwright manages separately from its npm installation:

```
npx playwright install
```

To run all end-to-end tests, use:

```
npm run e2e
```

## Lint
### Lint

The project uses eslint for lint checking. If you are using an IDE such as Visual Studio Code, you will likely see eslint problems highlighted by the IDE. However, you can always run eslint from commandline.

To run eslint, use:

```
npm run lint
```

# Continuous Integration (CI)
## Continuous Integration (CI)

The project is also set up to enable continuous integration, although there is currently no active service used for it (it used to be Travis CI until the free tier was disestablished):

```
npm run ci
```

This is a shorthand for running unit tests, e2e tests, building the project with production config and running eslint.

# How generated code works
## How generated code works

As of v1.2.1, there are three main code generation scripts.

## `scripts/generate-lib-files.js`
### `scripts/generate-lib-files.js`
This script prepares some files like `package.json` and `README.md` for the slider library, based on files in top-level directory.

Note that the generated `package.json` for the library will be different from top-level `package.json`. This is because the top-level `package.json` is used to build and run the demo app, while the library `package.json` is specifically crafted for use with `ng-packagr` to build the library and later being included in the resulting NPM package.

## `scripts/generate-demo-app-snippets.js`
### `scripts/generate-demo-app-snippets.js`

This script prepares the demo snippets shown in demo app by pasting code from the samples and generating the HTML templates used in final app. Code highlighting is achieved using [prismjs](https://prismjs.com/).

## `scripts/generate-demo-app-docs.js`
### `scripts/generate-demo-app-docs.js`

This script generates the API documentation pages in demo app. This is done by running [typedoc](https://typedoc.org/). The pages are then embedded inside an iframe in the demo app.

# Githb pages
## Github pages

The content displayed on Github pages for the slider (https://angular-slider.github.io/ngx-slider/) is contained on `gh-pages` branch as per standard Github convention.

This branch is not meant for manual updates. It is managed automatically based on built demo app files by invoking:

```
npm run publish-gh
```

# Release checklist
### Release checklist

1. Check that all tests pass and build is successful:
```
Expand Down
2 changes: 1 addition & 1 deletion KNOWN_ISSUES.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,4 +35,4 @@ Using `transform : scale(N)` in css will mess with the calculation of the slider

## Compatibility with Angular's recommended Content Security Policy (CSP)

Ngx-Slider makes use of innerHTML which means that sites that make use of a Content Security Policy (CSP) throw an exceptions. To fix this you can set the value of the `AllowUnsafeHtmlInSlider` provider in your app.module to `false`. Note that this will prevent you from customizing labels using HTML.
Ngx-Slider makes use of innerHTML which means that sites that make use of a Content Security Policy (CSP) throw an exceptions. To fix this you can set the value of the `AllowUnsafeHtmlInSlider` provider in your app.module to `false`. Note that this will prevent you from customizing labels using HTML.
Loading

0 comments on commit b953bd0

Please sign in to comment.