Creating command to reload page

Share & showcase
1

In Obsidian there is no build-in command to reload active page. But sometimes you need to. Some plugins, like dataview or supercharged links won’t refresh in real time, and you have to leave the page and open it again to refresh the view. It can be a little bothersome.
Luckily, you can easily reload your page with obsidian api. This simple line does the trick:

app.workspace.activeLeaf.rebuildView()

Now, how would you turn this little script into runnable Obsidian command (without writing the whole new plugin)? There are several ways to do this. For ones, you can use the Templater plugin. Create template like this:

<%*
app.workspace.activeLeaf.rebuildView()
%>

and bind it to the hotkey. Now the command is created by Templater. The only downside is that Templater for now is not working in canvas. Since my use case was to refresh supercharged links specificly in canvas, I looked for another options.

Another way is installing the “User Plugins” plugin. It’s a little more complicated, but works everywhere, unlike Templater. Create the js file and write this code in it:

module.exports = {}
module.exports.onload = function(plugin) {
    plugin.addCommand({
		id: 'reload-page',
        name: 'Reload page',
        callback: () => {
            app.workspace.activeLeaf.rebuildView()
        }
    });
}

Then enable the script in the User Plugins settings. It also creates command you can bind to hotkey or call from the command palette.

I hope the developers will add build-in command to reload files in the future, but this works for me for now.

2 Likes
2

Really like this idea. Some other tools:

  • Dataview has a hotkey available through: Dataview: Force Refresh All Views and Blocks

  • Obsidian also has a menu option: View > Force Reload. macOS users can assign a hotkey to this through System Settings > Keyboard > Keyboard Shortcuts > App Shortcuts.

3

Yet another variant is to use a QuickAdd macro. Now you insert the following code into a file, and then create a macro linking to that file:

module.exports =  async (params) => {
   await app.workspace.activeLeaf.rebuildView()
 }

If you enable that choice, it can be called as a command, and assigned a hotkey (like the other variants listed above).

Sadly, this often doesn’t work to refresh the queries in a page, but it do seem like rebuildView() refreshes the queries.

1 Like
4

I added this as the QuickAdd: Rebuild current view command, and accompanied it with a button in one particular note like the following:

```button
name Rebuild view
type command
action QuickAdd: Rebuild current view
```
^button-rebuild

This has then allowed me to in a random note with a Dataview query to do:

`button-rebuild`
```dataview
...
```

And I get the output like this:
image

Extremely practical and so far the most efficient way I’ve found to reload the Dataview queries. (Now if only I could style the button to hover over the lower right of the div containing the query result. Somewhat like the Copy button (or Edit this block icon) hovering in the upper right of code blocks. Then it would just be dandy… )