Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature] Hash cloak option on AnchorScrollTo (WIP) #186

Draft
wants to merge 1 commit into
base: develop
Choose a base branch
from
+16 −2
Draft

[Feature] Hash cloak option on AnchorScrollTo (WIP) #186

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 16 additions & 2 deletions packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@
export class AnchorScrollTo<T extends BaseProps = BaseProps> extends Base<AnchorScrollToProps & T> {
static config: BaseConfig = {
name: 'AnchorScrollTo',
options: {
hashCloak: Boolean,
},
};

/**
Expand All @@ -27,10 +30,21 @@
* @param {MouseEvent} event
* @returns {void}
*/
onClick(event) {
async onClick(event) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
async onClick(event) {
async onClick(event) {
if (
this.$el.pathname !== window.location.pathname ||
this.$el.origin !== window.location.origin
) {
return;
}

const target = document.querySelector(this.targetSelector) as HTMLElement;

Check warning on line 34 in packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts

View check run for this annotation

Codecov / codecov/patch

packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts#L33-L34 

Added lines #L33 - L34 were not covered by tests
if (!target) {
return;

Check warning on line 36 in packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts

View check run for this annotation

Codecov / codecov/patch

packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts#L36 

Added line #L36 was not covered by tests
}

try {
scrollTo(this.targetSelector);
event.preventDefault();
await scrollTo(target);

Check warning on line 41 in packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts

View check run for this annotation

Codecov / codecov/patch

packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts#L41 

Added line #L41 was not covered by tests

if (this.$options.hashCloak) {
return;

Check warning on line 44 in packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts

View check run for this annotation

Codecov / codecov/patch

packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts#L44 

Added line #L44 was not covered by tests
}

window.location.hash = this.targetSelector;

Check warning on line 47 in packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts

View check run for this annotation

Codecov / codecov/patch

packages/ui/atoms/AnchorScrollTo/AnchorScrollTo.ts#L47 

Added line #L47 was not covered by tests
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we avoid the problem with a specified offset ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

historyReplace({ hash: 'hello-world' });

} catch {
// Silence is golden.
}
Expand Down
Loading