Add markdown rendering for script and category titles to improve the
presentation of textual content.
- Introduce reusable `MarkdownText` for markdown rendering.
- Incorporate markdown styling into dedicated SCSS file for clarity.
- Define explicit font sizes for consistent visual experience.
- Apply `MarkdownText` usage across UI for unified markdown rendering.
- Streamline related styles and layout for improved maintainability
- Set font sizes explicitly for better consistency and to avoid
unexpected inheritence.
This enhancement enables richer text formatting and improves the user
interface's flexibility in displaying content.
This commit fixes a UI bug where the circle icon of the revertbutton was
unresponsive to clicks. The solution involves replacing the
pseudo-element (`:before`) with an actual HTML element, enabling direct
event binding.
Additional improvements include:
- Removal of redundant `z-index` properties to simplify click event
handling and reduce complexity.
- Programmatic toggle of `isChecked` on click, providing more controlled
and explicit behavior and avoiding issues with native checkbox
behavior, especially when overlaid on a pseudo-element.
This commit resolves a rendering bug in the tree view component.
Previously, updating the tree collection prior to node updates led to
rendering errors due to the presence of non-existent nodes in the new
collection.
Changes:
- Implement manual control over the rendering process in tree view. This
includes clearing the rendering queue and currently rendered nodes
before updates, aligning the rendering process with the updated
collection.
- Add Cypress E2E tests to test switching between all operating systems
and script views, ensuring no uncaught errors and preventing
regression.
- Replace hardcoded operating system lists in the download URL list view
with a unified `getSupportedOsList()` method from the application,
reducing duplication and simplifying future updates.
- Rename `initial-nodes` to `nodes` in `TreeView.vue` to reflect their
mutable nature.
- Centralize the function for getting operating system names into
`OperatingSystemNames.ts`, improving reusability in E2E tests.
This commit resolves the issue with the `:active` pseudo-class not
activating in mobile Safari on iOS devices. It introduces a workaround
specifically for mobile Safari on iOS/iPadOS to enable the `:active`
pseudo-class. This ensures a consistent and responsive user interface
in response to touch states on mobile Safari.
Other supporting changes:
- Introduce new test utility functions such as `createWindowEventSpies`
and `formatAssertionMessage` to improve code reusability and
maintainability.
- Improve browser detection:
- Add detection for iPadOS and Windows 10 Mobile.
- Add touch support detection to correctly determine iPadOS vs macOS.
- Fix misidentification of some Windows 10 Mobile platforms as Windows
Phone.
- Improve test coverage and refactor tests.
This commit addresses incorrect URL rendering within documentation text
by improving auto-linkified URL labels, handling `+` symbols as spaces,
enhancing readability of encoded path segments and manually updating
some of the documetation.
Key improvements:
- Parse `+` as whitespace in URLs for accurate script labeling.
- Interpret multiple whitespaces as single for robustness.
- Decode path segments for clearer links.
- Refactor markdown renderer.
- Expand unit tests for comprehensive coverage.
Documentation has been updated to fix inline URL references and improve
linkification across several scripts, ensuring more readable and
user-friendly content.
Affected files and documentation sections have been adjusted
accordingly, including script and category names for consistency and
clarity.
Some of the script/category documentation changing fixing URL rendering
includes:
- 'Disable sending information to Customer Experience Improvement
Program':
- Fix reference URLs being inlined.
- 'Disable "Secure boot" button in "Windows Security"':
- Fix rendering issue due to auto-linkification of `markdown-it`.
- 'Clear Internet Explorer DOMStore':
- Fix rendering issue due to auto-linkification of `markdown-it`.
- 'Disable "Windows Defender Firewall" service':
- Fix rendering issue due to auto-linkification of `markdown-it`.
- Convert YAML comments to markdown comments visible by users.
- Add breaking behavior to script name, changing script name to.
- 'Disable Microsoft Defender Firewall services and drivers':
- Remove information about breaking behavior to avoid duplication and
be consistent with the documentation of the rest of the collections.
- Use consistent styling for warning texts starting with `Caution:`.
- Rename 'Remove extensions' category to 'Remove extension apps' for
consistency with names of its sibling categories.
This commit introduces a batched debounce mechanism for managing user
selection state changes. It effectively reduces unnecessary processing
during rapid script checking, preventing multiple triggers for code
compilation and UI rendering.
Key improvements include:
- Enhanced performance, especially noticeable when selecting large
categories. This update resolves minor UI freezes experienced when
selecting categories with numerous scripts.
- Correction of a bug where the code area only highlighted the last
selected script when multiple scripts were chosen.
Other changes include:
- Timing functions:
- Create a `Timing` folder for `throttle` and the new
`batchedDebounce` functions.
- Move these functions to the application layer from the presentation
layer, reflecting their application-wide use.
- Refactor existing code for improved clarity, naming consistency, and
adherence to new naming conventions.
- Add missing unit tests.
- `UserSelection`:
- State modifications in `UserSelection` now utilize a singular object
inspired by the CQRS pattern, enabling batch updates and flexible
change configurations, thereby simplifying change management.
- Remove the `I` prefix from related interfaces to align with new coding
standards.
- Refactor related code for better testability in isolation with
dependency injection.
- Repository:
- Move repository abstractions to the application layer.
- Improve repository abstraction to combine `ReadonlyRepository` and
`MutableRepository` interfaces.
- E2E testing:
- Introduce E2E tests to validate the correct batch selection
behavior.
- Add a specialized data attribute in `TheCodeArea.vue` for improved
testability.
- Reorganize shared Cypress functions for a more idiomatic Cypress
approach.
- Improve test documentation with related information.
- `SelectedScript`:
- Create an abstraction for simplified testability.
- Introduce `SelectedScriptStub` in tests as a substitute for the
actual object.
These updates ensure better adherence to Vue 3 standards and improve
overall code quality and readability.
- Update ESLint configuration from Vue 2.x to Vue 3 rules.
- Switch from "essential" to strictest "recommended" ESLint ruleset.
- Adjust ESLint script to treat warnings as errors by using
`--max-warnings=0` flag. This enforces stricter code quality controls
provided by Vue 3 rules.
This commit applies `strictNullChecks` to the entire codebase to improve
maintainability and type safety. Key changes include:
- Remove some explicit null-checks where unnecessary.
- Add necessary null-checks.
- Refactor static factory functions for a more functional approach.
- Improve some test names and contexts for better debugging.
- Add unit tests for any additional logic introduced.
- Refactor `createPositionFromRegexFullMatch` to its own function as the
logic is reused.
- Prefer `find` prefix on functions that may return `undefined` and
`get` prefix for those that always return a value.
This commit changes `WatchSource` signatures into `Readonly<Ref>`s.
It provides two important benefits:
1. Eliminates the possibility of `undefined` states, that's result of
using `WatchSource`s. This previously required additional null checks.
By using `Readonly<Ref>`, the state handling becomes simpler and less
susceptible to null errors.
2. Optimizes performance by using references:
- Avoids the reactive layer of `computed` references when not needed.
- The `watch` syntax, such as `watch(() => ref.value)`, can introduce
side effects. For example, it does not account for `triggerRef` in
scenarios where the value remains unchanged, preventing the watcher
from running (vuejs/core#9579).
This commit introduces `useUserSelectionState` compositional hook. it
centralizes and allows reusing the logic for tracking and mutation user
selection state across the application.
The change aims to increase code reusability, simplify the code, improve
testability, and adhere to the single responsibility principle. It makes
the code more reliable against race conditions and removes the need for
tracking deep changes.
Other supporting changes:
- Introduce `CardStateIndicator` component for displaying the card state
indicator icon, improving the testability and separation of concerns.
- Refactor `SelectionTypeHandler` to use functional code with more clear
interfaces to simplify the code. It reduces complexity, increases
maintainability and increase readability by explicitly separating
mutating functions.
- Add new unit tests and extend improving ones to cover the new logic
introduced in this commit. Remove the need to mount a wrapper
component to simplify and optimize some tests, using parameter
injection to inject dependencies intead.
This commit improves the dependency injection mechanism by introducing a
custom `injectKey` function.
Key improvements are:
- Enforced type consistency during dependency registration and
instantiation.
- Simplified injection process, abstracting away the complexity with a
uniform API, regardless of the dependency's lifetime.
- Eliminated the possibility of `undefined` returns during dependency
injection, promoting fail-fast behavior.
- Removed the necessity for type casting to `symbol` for injection keys
in unit tests by using existing types.
- Consalidated imports, combining keys and injection functions in one
`import` statement.
This commit fixes a bug where the check states of tree nodes were not
correctly updated upon selecting predefined groups like "Standard",
"Strict", "None" and "All".
It resolves the issue by manually triggering of updates for mutated
array containing selected scripts.
It enhances test coverage to prevent regression and verify the correct
behavior of state updates.
This bug was introduced in commit
4995e49c46, which optimized reactivity by
removing deep state tracking.
- Migrate from "Vue 2.X" to "Vue 3.X"
- Migrate from "Vue Test Utils v1" to "Vue Test Utils v2"
Changes in detail:
- Change `inserted` to `mounted`.
- Change `::v-deep` to `:deep`.
- Change to Vue 3.0 `v-modal` syntax.
- Remove old Vue 2.0 transition name, keep the ones for Vue 3.0.
- Use new global mounting API `createApp`.
- Change `destroy` to `unmount`.
- Bootstrapping:
- Move `provide`s for global dependencies to a bootsrapper from
`App.vue`.
- Remove `productionTip` setting (not in Vue 3).
- Change `IVueBootstrapper` for simplicity and Vue 3 compatible API.
- Add missing tests.
- Remove `.text` access on `VNode` as it's now internal API of Vue.
- Import `CSSProperties` from `vue` instead of `jsx` package.
- Shims:
- Remove unused `shims-tsx.d.ts`.
- Remove `shims-vue.d.ts` that's missing in quickstart template.
- Unit tests:
- Remove old typing workaround for mounting components.
- Rename `propsData` to `props`.
- Remove unneeded `any` cast workarounds.
- Move stubs and `provide`s under `global` object.
Other changes:
- Add `dmg-license` dependency explicitly due to failing electron builds
on macOS (electron-userland/electron-builder#6520,
electron-userland/electron-builder#6489). This was a side-effect of
updating dependencies for this commit.
- Replace `ref`s with `shallowRef` when deep reactivity is not needed.
- Replace `readonly`s with `shallowReadonly` where the goal is to only
prevent `.value` mutation.
- Remove redundant `ref` in `SizeObserver.vue`.
- Remove redundant nested `ref` in `TooltipWrapper.vue`.
- Remove redundant `events` export from `UseCollectionState.ts`.
- Remove redundant `computed` from `UseCollectionState.ts`.
- Remove `timestamp` from `TreeViewFilterEvent` that becomes unnecessary
after using `shallowRef`.
- Add missing unit tests for `UseTreeViewFilterEvent`.
- Add missing stub for `FilterChangeDetails`.
Optimize the tree view rendering during searches by enhancing the render
queue ordering. This update changes the rendering order to prioritize
visible nodes, leading to faster appearance of these nodes during
searches. The ordering logic now ignores the depth in the hierarchy and
instead focused on the node order. The collapsed check for the node
itself is removed, ensuring that visible collapsed parents are first
while their invisible children are rendered later.
This commit updates various dependencies to their latest versions.
Other changes include:
- Moved the following from `devDependencies` to `dependencies`:
- `electron-log`
- `electron-updater`
- Remove `npm` dependency.
- Code changes:
- Add type casting in several places to align with the latest
`typescript` version.
- Adopt to new return type of `setTimeout`.
- Dependencies not upgraded due to
`@vue/eslint-config-airbnb-with-typescript` not supporting
`@eslint-typescript` V6 (see vuejs/eslint-config-airbnb#58):
- `vue/eslint-config-typescript`
- `@typescript-eslint/eslint-plugin`
- `@typescript-eslint/parser`
- Enable video recording for cypress as it's disabled by default since
13.X.X.
The tree view rendering performance is optimized by improving the node
render queue ordering. The node rendering order is modified based on the
expansion state and the depth in the hierarchy, leading to faster
rendering of visible nodes. This optimization is applied when the tree
nodes are not expanded to improve the rendering speed.
This new ordering ensures that nodes are rendered more efficiently,
prioritizing nodes that are collapsed and are at a higher level in the
hierarchy.
This commit fixes an issue where the check state of categories was lost
when toggling between card and tree views. This is solved by immediately
emitting node state changes for all nodes. This ensures consistent view
transitions without any loss of node state information.
Furthermore, this commit includes added unit tests for the modified code
sections.
Key highlights:
- Written from scratch to cater specifically to privacy.sexy's
needs and requirements.
- The visual look mimics the previous component with minimal changes,
but its internal code is completely rewritten.
- Lays groundwork for future functionalities like the "expand all"
button a flat view mode as discussed in #158.
- Facilitates the transition to Vue 3 by omitting the Vue 2.0 dependent
`liquour-tree` as part of #230.
Improvements and features:
- Caching for quicker node queries.
- Gradual rendering of nodes that introduces a noticable boost in
performance, particularly during search/filtering.
- `TreeView` solely governs the check states of branch nodes.
Changes:
- Keyboard interactions now alter the background color to highlight the
focused item. Previously, it was changing the color of the text.
- Better state management with clear separation of concerns:
- `TreeView` exclusively manages indeterminate states.
- `TreeView` solely governs the check states of branch nodes.
- Introduce transaction pattern to update state in batches to minimize
amount of events handled.
- Improve keyboard focus, style background instead of foreground. Use
hover/touch color on keyboard focus.
- `SelectableTree` has been removed. Instead, `TreeView` is now directly
integrated with `ScriptsTree`.
- `ScriptsTree` has been refactored to incorporate hooks for clearer
code and separation of duties.
- Adopt Vue-idiomatic bindings instead of keeping a reference of the
tree component.
- Simplify and change filter event management.
- Abandon global styles in favor of class-scoped styles.
- Use global mixins with descriptive names to clarify indended
functionality.
As part of transition to Vue 3.0 and Vite (#230), this commit
facilitates the shift towards building rest of the application using
Vite. By doing so, it eliminates reliance on outdated Electron building
system that offered limited control, blocking desktop builds (#233).
Changes include:
- Introduce Vite with Vue 2.0 plugin for test execution.
- Remove `mocha`, `chai` and other related dependencies.
- Adjust test to Vitest syntax.
- Revise and update `tests.md` to document the changes.
- Add `@modyfi/vite-plugin-yaml` plugin to be able to use yaml file
depended logic on test files, replacing previous webpack behavior.
- Fix failing tests that are revealed by Vitest due to unhandled errors
and lack of assertments.
- Remove the test that depends on Vue CLI populating `process.env`.
- Use `jsdom` for unit test environment, adding it to dependency to
`package.json` as project now depends on it and it was not specified
even though `package-lock.json` included it.
This commits fixes an issue where the `REVERT` label on revert toggle
might render as `REVER` or in a similarly clipped manner due to its
fixed width. The problem is visible when certain fonts fail to load or
browser engines render content non-standardly.
Changes:
- Refactor UI component to have its own separate Vue component with unit
tests.
- Rework component design to utilize flexbox, enhancing its adaptability
and simplifying the structure.
- Remove obselete `webkit` directives.
- Refactor SCSS for clearer structure and better SCSS best-practices.
- Use `em` when possible instead of `px` for improved responsiveness.
- Migrate `StatefulVue`:
- Introduce `UseCollectionState` that replaces its behavior and acts
as a shared state store.
- Add more encapsulated, granular functions based on read or write
access to state in CollectionState.
- Some linting rules get activates due to new code-base compability to
modern parses, fix linting errors.
- Rename Dialog to ModalDialog as after refactoring,
eslintvue/no-reserved-component-names does not allow name Dialog.
- To comply with `vue/multi-word-component-names`, rename:
- `Code` -> `CodeInstruction`
- `Handle` -> `SliderHandle`
- `Documentable` -> `DocumentableNode`
- `Node` -> `NodeContent`
- `INode` -> `INodeContent`
- `Responsive` -> `SizeObserver`
- Remove `vue-property-decorator` and `vue-class-component`
dependencies.
- Refactor `watch` with computed properties when possible for cleaner
code.
- Introduce `UseApplication` to reduce repeated code in new components
that use `computed` more heavily than before.
- Change TypeScript target to `es2017` to allow top level async calls
for getting application context/state/instance to simplify the code by
removing async calls. However, mocha (unit and integration) tests do
not run with top level awaits, so a workaround is used.
All outbound links now include `rel="noopener noreferrer"` attribute.
This security improvement prevents the new page from being able to
access the `window.opener` property and ensures it runs in a separate
process.
`rel="noopener"`:
When a new page is opened using `target="_blank"`, the new page runs
on the same process as the originating page, and has a reference to
the originating page `window.opener`. By implementing
`rel="noopener"`, the new page is prevented to use `window.opener`
property.
It's security issue because the newly opened website could
potentially redirect the page to a malicious URL. Even though
privacy.sexy doesn't have any sensitive information to protect, this
can still be a vector for phishing attacks.
`rel="noreferrer"`:
It implies features of `noopener`, and also prevents `Referer` header
from being sent to the new page. Referer headers may include
sensitive data, because they tell the new page the URL of the page
the request is coming from.
Rework documentation URLs as inline markdown.
Redesign documentations with markdown text.
Redesign way to document scripts/categories and present the
documentation.
Documentation is showed in an expandable box instead of tooltip. This is
to allow writing longer documentation (tooltips are meant to be used for
short text) and have better experience on mobile.
If a node (script/category) has documentation it's now shown with single
information icon (ℹ) aligned to right.
Add support for rendering documentation as markdown. It automatically
converts plain URLs to URLs with display names (e.g.
https://docs.microsoft.com/..) will be rendered automatically like
"docs.microsoft.com - Windows 11 Privacy...".
- Use function abstractions (such as map, reduce, filter etc.) over
for-of loops to gain benefits of having less side effects and easier
readability.
- Enable `downLevelIterations` for writing modern code with lazy evaluation.
- Refactor for of loops to named abstractions to clearly express their
intentions without needing to analyse the loop itself.
- Add missing cases for changes that had no tests.
Major refactoring using ESLint with rules from AirBnb and Vue.
Enable most of the ESLint rules and do necessary linting in the code.
Also add more information for rules that are disabled to describe what
they are and why they are disabled.
Allow logging (`console.log`) in test files, and in development mode
(e.g. when working with `npm run serve`), but disable it when
environment is production (as pre-configured by Vue). Also add flag
(`--mode production`) in `lint:eslint` command so production linting is
executed earlier in lifecycle.
Disable rules that requires a separate work. Such as ESLint rules that
are broken in TypeScript: no-useless-constructor (eslint/eslint#14118)
and no-shadow (eslint/eslint#13014).
TSLint deprecated and is being replaced by ESLint.
Add Vue CLI plugin (@vue/cli-plugin-eslint) using:
`vue add @vue/cli-plugin-eslint`. It also adds `.eslintrc.js` manually
for Cypress since Vue CLI for ESLint misses it (vuejs/vue-cli#6892).
Also rename `npm run lint:vue` to `npm run lint:eslint` for better
clarification.
This commit disables all rules that the current code is not compliant
with. This allows for enabling them gradually and separating commits
instead of mixing ESLint introduction with other code changes.
AirBnb is chosen as base configuration.
"Standard" is not chosen due to its poor defaults. It makes code cleaner
but harder to maintain:
- It converts interfaces to types which is harder to read.
- Removes semicolons that helps to eliminate some ambigious code.
"Airbnb" on the other hand helps for easier future changes and
maintinability:
- Includes more useful rules.
- Keeps the semicolons and interfaces.
- Enforces trailing commas that makes it easier to delete lines later on.
- Delete branches: standard, prettier.
1. *Grouping* becomes *view*. Because *view* is more clear and extensible than *grouping*. It increases flexibility to extend by e.g. adding *flat* as a new view as discussed in #50, in this case "flat *view*" would make more sense than "flat *grouping*".
2. *None* becomes *tree*. Because *tree* is more descriptive than *none*.
Updates labels on top menu. As labels are updated, the file structure/names are refactored to follow the same concept. `TheScriptsList` is renamed to `TheScriptsView`. Also refactors `ViewChanger` so view types are presented in same way.
