├── .gitattributes ├── .github ├── CONTRIBUTING.md └── ISSUE_TEMPLATE.md ├── .gitignore ├── BrowserLinkInspector.sln ├── CHANGELOG.md ├── LICENSE ├── README.md ├── appveyor.yml ├── lib ├── Microsoft.Html.Core.dll ├── Microsoft.Html.Editor.dll ├── Microsoft.VisualStudio.Web.BrowserLink.12.0.dll ├── Microsoft.VisualStudio.Web.BrowserLink.12.0.xml └── Microsoft.Web.Core.dll └── src ├── BrowserLink ├── DesignMode │ ├── DesignModeBrowserLink.cs │ └── DesignModeBrowserLink.js └── InspectMode │ ├── InspectModeBrowserLink.cs │ └── InspectModeBrowserLink.js ├── BrowserLinkInspector.csproj ├── Helpers └── VsHelpers.cs ├── InspectorPackage.cs ├── Properties └── AssemblyInfo.cs ├── Resources └── Icon.png ├── packages.config ├── source.extension.cs ├── source.extension.ico ├── source.extension.resx └── source.extension.vsixmanifest /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | 4 | # Custom for Visual Studio 5 | *.cs diff=csharp 6 | *.sln merge=union 7 | *.csproj merge=union 8 | *.vbproj merge=union 9 | *.fsproj merge=union 10 | *.dbproj merge=union 11 | 12 | # Standard to msysgit 13 | *.doc diff=astextplain 14 | *.DOC diff=astextplain 15 | *.docx diff=astextplain 16 | *.DOCX diff=astextplain 17 | *.dot diff=astextplain 18 | *.DOT diff=astextplain 19 | *.pdf diff=astextplain 20 | *.PDF diff=astextplain 21 | *.rtf diff=astextplain 22 | *.RTF diff=astextplain 23 | -------------------------------------------------------------------------------- /.github/CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | Looking to contribute something? **Here's how you can help.** 4 | 5 | Please take a moment to review this document in order to make the contribution 6 | process easy and effective for everyone involved. 7 | 8 | Following these guidelines helps to communicate that you respect the time of 9 | the developers managing and developing this open source project. In return, 10 | they should reciprocate that respect in addressing your issue or assessing 11 | patches and features. 12 | 13 | 14 | ## Using the issue tracker 15 | 16 | The issue tracker is the preferred channel for [bug reports](#bug-reports), 17 | [features requests](#feature-requests) and 18 | [submitting pull requests](#pull-requests), but please respect the 19 | following restrictions: 20 | 21 | * Please **do not** use the issue tracker for personal support requests. Stack 22 | Overflow is a better place to get help. 23 | 24 | * Please **do not** derail or troll issues. Keep the discussion on topic and 25 | respect the opinions of others. 26 | 27 | * Please **do not** open issues or pull requests which *belongs to* third party 28 | components. 29 | 30 | 31 | ## Bug reports 32 | 33 | A bug is a _demonstrable problem_ that is caused by the code in the repository. 34 | Good bug reports are extremely helpful, so thanks! 35 | 36 | Guidelines for bug reports: 37 | 38 | 1. **Use the GitHub issue search** — check if the issue has already been 39 | reported. 40 | 41 | 2. **Check if the issue has been fixed** — try to reproduce it using the 42 | latest `master` or development branch in the repository. 43 | 44 | 3. **Isolate the problem** — ideally create an 45 | [SSCCE](http://www.sscce.org/) and a live example. 46 | Uploading the project on cloud storage (OneDrive, DropBox, et el.) 47 | or creating a sample GitHub repository is also helpful. 48 | 49 | 50 | A good bug report shouldn't leave others needing to chase you up for more 51 | information. Please try to be as detailed as possible in your report. What is 52 | your environment? What steps will reproduce the issue? What browser(s) and OS 53 | experience the problem? Do other browsers show the bug differently? What 54 | would you expect to be the outcome? All these details will help people to fix 55 | any potential bugs. 56 | 57 | Example: 58 | 59 | > Short and descriptive example bug report title 60 | > 61 | > A summary of the issue and the Visual Studio, browser, OS environments 62 | > in which it occurs. If suitable, include the steps required to reproduce the bug. 63 | > 64 | > 1. This is the first step 65 | > 2. This is the second step 66 | > 3. Further steps, etc. 67 | > 68 | > `` - a link to the project/file uploaded on cloud storage or other publicly accessible medium. 69 | > 70 | > Any other information you want to share that is relevant to the issue being 71 | > reported. This might include the lines of code that you have identified as 72 | > causing the bug, and potential solutions (and your opinions on their 73 | > merits). 74 | 75 | 76 | ## Feature requests 77 | 78 | Feature requests are welcome. But take a moment to find out whether your idea 79 | fits with the scope and aims of the project. It's up to *you* to make a strong 80 | case to convince the project's developers of the merits of this feature. Please 81 | provide as much detail and context as possible. 82 | 83 | 84 | ## Pull requests 85 | 86 | Good pull requests, patches, improvements and new features are a fantastic 87 | help. They should remain focused in scope and avoid containing unrelated 88 | commits. 89 | 90 | **Please ask first** before embarking on any significant pull request (e.g. 91 | implementing features, refactoring code, porting to a different language), 92 | otherwise you risk spending a lot of time working on something that the 93 | project's developers might not want to merge into the project. 94 | 95 | Please adhere to the [coding guidelines](#code-guidelines) used throughout the 96 | project (indentation, accurate comments, etc.) and any other requirements 97 | (such as test coverage). 98 | 99 | Adhering to the following process is the best way to get your work 100 | included in the project: 101 | 102 | 1. [Fork](http://help.github.com/fork-a-repo/) the project, clone your fork, 103 | and configure the remotes: 104 | 105 | ```bash 106 | # Clone your fork of the repo into the current directory 107 | git clone https://github.com//.git 108 | # Navigate to the newly cloned directory 109 | cd 110 | # Assign the original repo to a remote called "upstream" 111 | git remote add upstream https://github.com/madskristensen/.git 112 | ``` 113 | 114 | 2. If you cloned a while ago, get the latest changes from upstream: 115 | 116 | ```bash 117 | git checkout master 118 | git pull upstream master 119 | ``` 120 | 121 | 3. Create a new topic branch (off the main project development branch) to 122 | contain your feature, change, or fix: 123 | 124 | ```bash 125 | git checkout -b 126 | ``` 127 | 128 | 4. Commit your changes in logical chunks. Please adhere to these [git commit 129 | message guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html) 130 | or your code is unlikely be merged into the main project. Use Git's 131 | [interactive rebase](https://help.github.com/articles/interactive-rebase) 132 | feature to tidy up your commits before making them public. Also, prepend name of the feature 133 | to the commit message. For instance: "SCSS: Fixes compiler results for IFileListener.\nFixes `#123`" 134 | 135 | 5. Locally merge (or rebase) the upstream development branch into your topic branch: 136 | 137 | ```bash 138 | git pull [--rebase] upstream master 139 | ``` 140 | 141 | 6. Push your topic branch up to your fork: 142 | 143 | ```bash 144 | git push origin 145 | ``` 146 | 147 | 7. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/) 148 | with a clear title and description against the `master` branch. 149 | 150 | 151 | ## Code guidelines 152 | 153 | - Always use proper indentation. 154 | - In Visual Studio under `Tools > Options > Text Editor > C# > Advanced`, make sure 155 | `Place 'System' directives first when sorting usings` option is enabled (checked). 156 | - Before committing, organize usings for each updated C# source file. Either you can 157 | right-click editor and select `Organize Usings > Remove and sort` OR use extension 158 | like [BatchFormat](http://visualstudiogallery.msdn.microsoft.com/a7f75c34-82b4-4357-9c66-c18e32b9393e). 159 | - Before committing, run Code Analysis in `Debug` configuration and follow the guidelines 160 | to fix CA issues. Code Analysis commits can be made separately. 161 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ### Installed product versions 2 | - Visual Studio: [example 2015 Professional] 3 | - This extension: [example 1.1.21] 4 | 5 | ### Description 6 | Replace this text with a short description 7 | 8 | ### Steps to recreate 9 | 1. Replace this 10 | 2. text with 11 | 3. the steps 12 | 4. to recreate 13 | 14 | ### Current behavior 15 | Explain what it's doing and why it's wrong 16 | 17 | ### Expected behavior 18 | Explain what it should be doing after it's fixed. -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | packages 2 | 3 | # User files 4 | *.suo 5 | *.user 6 | *.sln.docstates 7 | .vs/ 8 | 9 | # Build results 10 | [Dd]ebug/ 11 | [Rr]elease/ 12 | x64/ 13 | [Bb]in/ 14 | [Oo]bj/ 15 | 16 | # MSTest test Results 17 | [Tt]est[Rr]esult*/ 18 | [Bb]uild[Ll]og.* 19 | 20 | # NCrunch 21 | *.ncrunchsolution 22 | *.ncrunchproject 23 | _NCrunch_WebCompiler -------------------------------------------------------------------------------- /BrowserLinkInspector.sln: -------------------------------------------------------------------------------- 1 |  2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio 15 4 | VisualStudioVersion = 15.0.26228.9 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "BrowserLinkInspector", "src\BrowserLinkInspector.csproj", "{21A614C7-748E-4622-B8CB-38F0AA20D8F1}" 7 | EndProject 8 | Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Items", "Solution Items", "{3B23DBEC-2D6D-4367-A54A-5AB50788BB6A}" 9 | ProjectSection(SolutionItems) = preProject 10 | appveyor.yml = appveyor.yml 11 | CHANGELOG.md = CHANGELOG.md 12 | README.md = README.md 13 | EndProjectSection 14 | EndProject 15 | Global 16 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 17 | Debug|Any CPU = Debug|Any CPU 18 | Release|Any CPU = Release|Any CPU 19 | EndGlobalSection 20 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 21 | {21A614C7-748E-4622-B8CB-38F0AA20D8F1}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 22 | {21A614C7-748E-4622-B8CB-38F0AA20D8F1}.Debug|Any CPU.Build.0 = Debug|Any CPU 23 | {21A614C7-748E-4622-B8CB-38F0AA20D8F1}.Release|Any CPU.ActiveCfg = Release|Any CPU 24 | {21A614C7-748E-4622-B8CB-38F0AA20D8F1}.Release|Any CPU.Build.0 = Release|Any CPU 25 | EndGlobalSection 26 | GlobalSection(SolutionProperties) = preSolution 27 | HideSolutionNode = FALSE 28 | EndGlobalSection 29 | EndGlobal 30 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Road map 2 | 3 | - [ ] Nothing yet... 4 | 5 | Features that have a checkmark are complete and available for 6 | download in the 7 | [CI build](http://vsixgallery.com/extension/bc4780ab-de6e-4999-bebf-51390e1b75ef/). 8 | 9 | # Change log 10 | 11 | These are the changes to each version that has been released 12 | on the official Visual Studio extension gallery. 13 | 14 | ## 1.0 15 | 16 | - [x] Initial release 17 | - [x] Inspect mode 18 | - [x] Design mode -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2016 Mads Kristensen 2 | 3 | Licensed under the Apache License, Version 2.0 (the "License"); 4 | you may not use this file except in compliance with the License. 5 | You may obtain a copy of the License at 6 | 7 | http://www.apache.org/licenses/LICENSE-2.0 8 | 9 | Unless required by applicable law or agreed to in writing, software 10 | distributed under the License is distributed on an "AS IS" BASIS, 11 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | See the License for the specific language governing permissions and 13 | limitations under the License. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Browser Link Inspector 2017 2 | 3 | [![Build status](https://ci.appveyor.com/api/projects/status/ix60r69heymrn69f?svg=true)](https://ci.appveyor.com/project/madskristensen/browserlinkinspector) 4 | 5 | Download this extension from the [VS Marketplace](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BrowserLinkInspector2017) 6 | or get the [CI build](http://vsixgallery.com/extension/bc4780ab-de6e-4999-bebf-51390e1b75ef/). 7 | 8 | --------------------------------------- 9 | 10 | Adds inspect and debug mode directly in the browsers 11 | 12 | See the [change log](CHANGELOG.md) for changes and road map. 13 | 14 | ## Features 15 | 16 | - Inspect mode `(Ctrl+Alt+I)` 17 | - Debug mode `(Ctrl+Alt+D)` 18 | - Supports the [Web Essentials Chrome extension](https://chrome.google.com/webstore/detail/web-essentials/mghdcdlpcdiodelbplncnodiiadljhhk) 19 | 20 | ### Inspect Mode 21 | This mode will put the browser in a state where hovering the various DOM elements in the Browser will open the corresponding file in Visual Studio and select the range that produced the DOM element. 22 | 23 | ### Debug Mode 24 | Does the same as Inspect Mode as well as put the document in edit mode. It is then possible to make text changes directly in the browser and see the changes persisted back into the source file in Visual Studio in real time. 25 | 26 | 27 | ## Known Issues 28 | ASP.NET Core projects are not yet supported. 29 | 30 | ## Contribute 31 | Check out the [contribution guidelines](.github/CONTRIBUTING.md) 32 | if you want to contribute to this project. 33 | 34 | For cloning and building this project yourself, make sure 35 | to install the 36 | [Extensibility Tools 2015](https://visualstudiogallery.msdn.microsoft.com/ab39a092-1343-46e2-b0f1-6a3f91155aa6) 37 | extension for Visual Studio which enables some features 38 | used by this project. 39 | 40 | ## License 41 | [Apache 2.0](LICENSE) -------------------------------------------------------------------------------- /appveyor.yml: -------------------------------------------------------------------------------- 1 | image: Visual Studio 2017 2 | 3 | install: 4 | - ps: (new-object Net.WebClient).DownloadString("https://raw.github.com/madskristensen/ExtensionScripts/master/AppVeyor/vsix.ps1") | iex 5 | 6 | before_build: 7 | - ps: Vsix-IncrementVsixVersion | Vsix-UpdateBuildVersion 8 | - ps: Vsix-TokenReplacement src\source.extension.cs 'Version = "([0-9\\.]+)"' 'Version = "{version}"' 9 | 10 | build_script: 11 | - nuget restore -Verbosity quiet 12 | - msbuild /p:configuration=Release /p:DeployExtension=false /p:ZipPackageCompressionLevel=normal /v:m 13 | 14 | after_test: 15 | - ps: Vsix-PushArtifacts | Vsix-PublishToGallery 16 | -------------------------------------------------------------------------------- /lib/Microsoft.Html.Core.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/BrowserLinkInspector/0273a24c30ad58d5c307267969fa57b0a5a22407/lib/Microsoft.Html.Core.dll -------------------------------------------------------------------------------- /lib/Microsoft.Html.Editor.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/BrowserLinkInspector/0273a24c30ad58d5c307267969fa57b0a5a22407/lib/Microsoft.Html.Editor.dll -------------------------------------------------------------------------------- /lib/Microsoft.VisualStudio.Web.BrowserLink.12.0.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/BrowserLinkInspector/0273a24c30ad58d5c307267969fa57b0a5a22407/lib/Microsoft.VisualStudio.Web.BrowserLink.12.0.dll -------------------------------------------------------------------------------- /lib/Microsoft.VisualStudio.Web.BrowserLink.12.0.xml: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | Microsoft.VisualStudio.Web.BrowserLink.12.0 5 | 6 | 7 | 8 | Represents an Action that can be presented on the Browser Link Dashboard 9 | 10 | 11 | Initializes an instance of the BrowserLinkAction class. 12 | 13 | 14 | Initializes an instance of the BrowserLinkAction class. 15 | 16 | 17 | Menu item text 18 | 19 | 20 | True if the item should be displayed with a checkmark on the context menu 21 | 22 | 23 | True if the item should be enabled on the context menu 24 | 25 | 26 | Internal only. Invokes the callback delegate. 27 | 28 | 29 | Internal only. Invokes the update menu item delegate. 30 | 31 | 32 | True if the item should displayed on the context menu 33 | 34 | 35 | Represents an attribute that specifies a method is a browser link callback. 36 | 37 | 38 | Initializes a new instance of the BrowserLinkCallback class. 39 | 40 | 41 | Encapsulates a browser link connection between Visual Studio and a browser. 42 | 43 | 44 | 45 | The client browser display name. 46 | 47 | 48 | A unique connection identifier. 49 | 50 | 51 | Extensions attached to this connection. 52 | 53 | 54 | Fired after extensions for this connection have been created. 55 | 56 | 57 | Fires an internal event. 58 | 59 | 60 | Logs a message to the connected browser console. 61 | 62 | 63 | The Visual Studio project associated with this connection. 64 | 65 | 66 | Properties can be associated with this connection through this dictionary. Default property values can be found using keys in DefaultConnectionProperties. 67 | 68 | 69 | The client URL of this connection. 70 | 71 | 72 | Base class for browser link extensions. 73 | 74 | 75 | 76 | Returns Actions that are presented on the Browser Link Dashboard 77 | 78 | 79 | Client invoke root. 80 | 81 | 82 | Connections root. 83 | 84 | 85 | Factories root. 86 | 87 | 88 | Name of this extension. 89 | 90 | 91 | Called when the given connection has connected. Perform extension initialization here. 92 | 93 | 94 | Called when the given connection is disconnecting. Perform extension clean up here. 95 | 96 | 97 | Internal only. Initializes extension properties before we hand control to the extension author. 98 | 99 | 100 | Event arguments used for when a connection has been added or removed. 101 | 102 | 103 | 104 | Connection associated with this event. 105 | 106 | 107 | Extensible extension event object. 108 | Type to pass into the extensible event. 109 | 110 | 111 | 112 | Dispatches extensible event. 113 | 114 | 115 | Event handler for this extensible event. 116 | 117 | 118 | Extensible extension events. 119 | 120 | 121 | Constructs this object. 122 | 123 | 124 | Assign ExtensionEvent objects to this dictionary. 125 | 126 | 127 | Creates instances of browser link extension objects. 128 | 129 | 130 | Creates a BrowserLinkExtension object when a new connection is made. 131 | A BrowserLinkExtension object. 132 | The new connection. 133 | 134 | 135 | Returns the Javascript implementation of this extension. 136 | 137 | 138 | Root browser link service object. 139 | 140 | 141 | Provides access to all current client connections. 142 | 143 | 144 | Provides access to all loaded extension factories. 145 | 146 | 147 | Provides access to connection clients for remote method invocation. 148 | 149 | 150 | Provides accesses connection clients for remote method invocation. 151 | 152 | 153 | Accesses all clients. 154 | 155 | 156 | Access all clients except the ones specified. 157 | 158 | 159 | Accesses a client on a specific connection. 160 | 161 | 162 | Accesses clients of the specified connections. 163 | 164 | 165 | Permits invocation of Javascript browser link extension call backs. 166 | 167 | 168 | Invokes a client callback method. 169 | 170 | 171 | Invokes a client callback method asynchronously. 172 | Returns a Task which completes when the return value is ready. This is only supported on single connections. 173 | Method name to call. 174 | Arguments for method call. 175 | Type of return value. 176 | 177 | 178 | Interface for messaging from VS to the browser. 179 | 180 | 181 | Invokes a remote Javascript method. 182 | Browser connection to invoke against. 183 | Name of remote Javascript method to invoke. 184 | Argument list for remote Javascript method. 185 | 186 | 187 | Asynchronously invokes a remote Javascript method. 188 | Browser connection to invoke against. 189 | Name of remote Javascript method to invoke. 190 | Argument list for remote Javascript method. 191 | 192 | 193 | 194 | Browser link connections root. 195 | 196 | 197 | Fired on a new connection. 198 | 199 | 200 | Active connections. 201 | 202 | 203 | Invoked after a connection or disconnection. 204 | 205 | 206 | Fired on a disconnection. 207 | 208 | 209 | Provides access to the loaded Browser linkExtension factories. 210 | 211 | 212 | Provides access to extensible browser link events. 213 | 214 | 215 | Collection of loaded BrowserLinkExtensionFactory's. 216 | 217 | 218 | -------------------------------------------------------------------------------- /lib/Microsoft.Web.Core.dll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/madskristensen/BrowserLinkInspector/0273a24c30ad58d5c307267969fa57b0a5a22407/lib/Microsoft.Web.Core.dll -------------------------------------------------------------------------------- /src/BrowserLink/DesignMode/DesignModeBrowserLink.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.Html.Core.Tree.Nodes; 2 | using Microsoft.Html.Editor.Document; 3 | using Microsoft.VisualStudio.Text; 4 | using Microsoft.VisualStudio.Web.BrowserLink; 5 | using System; 6 | using System.Collections.Generic; 7 | using System.ComponentModel.Composition; 8 | using System.Diagnostics.CodeAnalysis; 9 | using System.IO; 10 | using System.Text.RegularExpressions; 11 | using System.Windows.Threading; 12 | 13 | namespace BrowserLinkInspector 14 | { 15 | [Export(typeof(IBrowserLinkExtensionFactory))] 16 | public class DesignModeFactory : IBrowserLinkExtensionFactory 17 | { 18 | public BrowserLinkExtension CreateExtensionInstance(BrowserLinkConnection connection) 19 | { 20 | return new DesignMode(); 21 | } 22 | 23 | public string GetScript() 24 | { 25 | using (Stream stream = GetType().Assembly.GetManifestResourceStream("BrowserLinkInspector.BrowserLink.DesignMode.DesignModeBrowserLink.js")) 26 | using (StreamReader reader = new StreamReader(stream)) 27 | { 28 | return reader.ReadToEnd(); 29 | } 30 | } 31 | } 32 | 33 | public class DesignMode : BrowserLinkExtension 34 | { 35 | BrowserLinkConnection _connection; 36 | 37 | public override IEnumerable Actions 38 | { 39 | get { yield return new BrowserLinkAction("Design Mode", SetDesignMode); } 40 | } 41 | 42 | public override void OnConnected(BrowserLinkConnection connection) 43 | { 44 | _connection = connection; 45 | } 46 | 47 | private void SetDesignMode(BrowserLinkAction action) 48 | { 49 | Browsers.Client(_connection).Invoke("setDesignMode"); 50 | } 51 | 52 | [SuppressMessage("Microsoft.Performance", "CA1822:MarkMembersAsStatic")] 53 | [BrowserLinkCallback] 54 | public void UpdateSource(string innerHtml, string file, int position) 55 | { 56 | VsHelpers.DTE.ItemOperations.OpenFile(file); 57 | 58 | Dispatcher.CurrentDispatcher.BeginInvoke(new Action(() => 59 | { 60 | var view = VsHelpers.GetCurentTextView(); 61 | var html = HtmlEditorDocument.TryFromTextView(view); 62 | 63 | if (html == null) 64 | return; 65 | 66 | ElementNode element; 67 | AttributeNode attribute; 68 | 69 | view.Selection.Clear(); 70 | html.HtmlEditorTree.GetPositionElement(position + 1, out element, out attribute); 71 | 72 | // HTML element 73 | if (element != null && element.Start == position) 74 | { 75 | Span span = new Span(element.InnerRange.Start, element.InnerRange.Length); 76 | string text = html.TextBuffer.CurrentSnapshot.GetText(span); 77 | 78 | if (text != innerHtml) 79 | { 80 | UpdateBuffer(innerHtml, html, span); 81 | } 82 | } 83 | // ActionLink 84 | else if (element.Start != position) 85 | { 86 | //@Html.ActionLink("Application name", "Index", "Home", null, new { @class = "brand" }) 87 | Span span = new Span(position, 100); 88 | 89 | if (position + 100 < html.TextBuffer.CurrentSnapshot.Length) 90 | { 91 | string text = html.TextBuffer.CurrentSnapshot.GetText(span); 92 | var result = Regex.Replace(text, @"^html.actionlink\(""([^""]+)""", "Html.ActionLink(\"" + innerHtml + "\"", RegexOptions.IgnoreCase); 93 | 94 | UpdateBuffer(result, html, span); 95 | } 96 | } 97 | 98 | }), DispatcherPriority.ApplicationIdle, null); 99 | } 100 | 101 | private static void UpdateBuffer(string innerHTML, HtmlEditorDocument html, Span span) 102 | { 103 | VsHelpers.DTE.UndoContext.Open("Design Mode changes"); 104 | 105 | try 106 | { 107 | html.TextBuffer.Replace(span, innerHTML); 108 | VsHelpers.DTE.ActiveDocument.Save(); 109 | } 110 | catch 111 | { 112 | // Do nothing 113 | } 114 | finally 115 | { 116 | VsHelpers.DTE.UndoContext.Close(); 117 | } 118 | } 119 | 120 | [SuppressMessage("Microsoft.Performance", "CA1822:MarkMembersAsStatic")] 121 | [BrowserLinkCallback] 122 | public void Undo() 123 | { 124 | try 125 | { 126 | VsHelpers.DTE.ExecuteCommand("Edit.Undo"); 127 | VsHelpers.DTE.ActiveDocument.Save(); 128 | } 129 | catch 130 | { 131 | // Do nothing 132 | } 133 | } 134 | 135 | [SuppressMessage("Microsoft.Performance", "CA1822:MarkMembersAsStatic")] 136 | [BrowserLinkCallback] 137 | public void Redo() 138 | { 139 | try 140 | { 141 | VsHelpers.DTE.ExecuteCommand("Edit.Redo"); 142 | VsHelpers.DTE.ActiveDocument.Save(); 143 | } 144 | catch 145 | { 146 | // Do nothing 147 | } 148 | } 149 | 150 | [SuppressMessage("Microsoft.Performance", "CA1822:MarkMembersAsStatic")] 151 | [BrowserLinkCallback] 152 | public void Save() 153 | { 154 | if (VsHelpers.DTE.ActiveDocument != null && !VsHelpers.DTE.ActiveDocument.Saved) 155 | { 156 | VsHelpers.DTE.ActiveDocument.Save(); 157 | } 158 | } 159 | } 160 | } -------------------------------------------------------------------------------- /src/BrowserLink/DesignMode/DesignModeBrowserLink.js: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | 4 | (function (browserLink, $) { 5 | /// 6 | /// 7 | 8 | var inspectModeOn; 9 | var inspectOverlay; 10 | var current, map, hasChanged, 11 | selectedClass = "__browserLink_selected_design", 12 | overlay = "__browserLink_InspectOverlay"; 13 | 14 | function getInspectOverlay() { 15 | if (!inspectOverlay) { 16 | 17 | $("body").append("
" + 20 | "#" + overlay + " {position:fixed; cursor: crosshair; box-sizing: border-box; top: 0; left: 0; bottom: 0; right: 0; background-color: #888; opacity: 0.2; overflow: visible; z-index: 999999999; /*overrde*/ width: auto; height: auto; margin: 0; padding: 0; background-image: none; display:none}" + 21 | "." + selectedClass + " {outline: 3px solid lightgreen;}" + 22 | ""); 23 | 24 | inspectOverlay = $("#" + overlay); 25 | 26 | inspectOverlay.mousemove(function (args) { 27 | inspectOverlay.css("height", "0"); 28 | 29 | var target = document.elementFromPoint(args.clientX, args.clientY); 30 | 31 | inspectOverlay.css("height", "auto"); 32 | 33 | if (target) { 34 | while (target && !browserLink.sourceMapping.canMapToSource(target)) { 35 | target = target.parentElement; 36 | } 37 | 38 | if (target && target.innerHTML) { 39 | if (current && current !== target) { 40 | $(current).removeClass(selectedClass); 41 | } 42 | 43 | map = browserLink.sourceMapping.getCompleteRange(target); 44 | 45 | if (map && map.sourcePath) { 46 | if (isValidFile(map.sourcePath.toLowerCase())) { 47 | current = target; 48 | $(target).addClass(selectedClass); 49 | browserLink.sourceMapping.selectCompleteRange(current); 50 | } 51 | else { 52 | enableDesignMode(false); 53 | alert("Design Mode doesn't work for ASP.NET Web Forms"); 54 | } 55 | } 56 | } 57 | } 58 | }); 59 | 60 | inspectOverlay.click(function () { 61 | if (!current || current.tagName.toUpperCase() === "BODY" || current.tagName.toUpperCase() === document.documentElement.tagName.toUpperCase()) { 62 | return; 63 | } 64 | 65 | inspectOverlay.hide(); 66 | 67 | if (current) { 68 | current.contentEditable = true; 69 | current.focus(); 70 | $(current).keydown(typing); 71 | } 72 | }); 73 | } 74 | 75 | return inspectOverlay; 76 | } 77 | 78 | function isValidFile(sourcePath) { 79 | var exts = [".master", ".aspx", ".ascx"]; 80 | var index = sourcePath.lastIndexOf("."); 81 | var extension = sourcePath.substring(index); 82 | 83 | for (var i = 0; i < exts.length; i++) { 84 | if (exts[i] === extension) 85 | return false; 86 | } 87 | 88 | return true; 89 | } 90 | 91 | var originalSelectionContent; 92 | 93 | function enableDesignMode(enabled) { 94 | if (window.getSelection) { 95 | inspectModeOn = enabled; 96 | hasChanged = false; 97 | 98 | if (enabled && hasChanged) { 99 | current.contentEditable = true; 100 | current.focus(); 101 | $(current).addClass(selectedClass); 102 | originalSelectionContent = current.innerHTML; 103 | } 104 | else if (enabled) { 105 | getInspectOverlay().show(); 106 | } 107 | else { 108 | getInspectOverlay().hide(); 109 | if (current) { 110 | current.contentEditable = false; 111 | current.blur(); 112 | $(current).removeClass(selectedClass); 113 | browserLink.invoke("Save"); 114 | } 115 | } 116 | } 117 | else { 118 | alert("The browser doesn't support Design Mode"); 119 | } 120 | } 121 | 122 | function typing(e) { 123 | if (inspectModeOn && map && e.keyCode !== 27 && !e.altKey) { 124 | 125 | if (e.keyCode === 89 && e.ctrlKey) { // 89 = y 126 | browserLink.invoke("Redo"); 127 | } 128 | else if (e.keyCode === 90 && e.ctrlKey) { // 90 = z 129 | browserLink.invoke("Undo"); 130 | } 131 | else if (e.keyCode === 13 && !e.shiftKey) { // 13 = Enter 132 | e.preventDefault(); 133 | } 134 | else if (map && map.sourcePath) { 135 | hasChanged = true; 136 | setTimeout(function () { 137 | //Only fire the update if something has changed 138 | if (!current || current.innerHTML != originalSelectionContent) { 139 | browserLink.invoke("UpdateSource", current.innerHTML, map.sourcePath, map.startPosition); 140 | } 141 | }, 50); 142 | } 143 | } 144 | } 145 | 146 | $(document).keydown(function (e) { 147 | if (e.keyCode === 68 && e.ctrlKey && e.altKey) { // 68 = d 148 | enableDesignMode(true); 149 | } 150 | else if (e.keyCode === 27) { // ESC 151 | enableDesignMode(false); 152 | } 153 | }); 154 | 155 | window.__weSetDesignMode = function () { 156 | enableDesignMode(true); 157 | }; 158 | 159 | 160 | return { 161 | setDesignMode: function () { 162 | enableDesignMode(true); 163 | }, 164 | 165 | 166 | menu: { 167 | displayText: 'Browser Link Inspector', 168 | 'Design Mode (Ctrl+Alt+D)': 'setDesignMode' 169 | } 170 | }; 171 | 172 | }); -------------------------------------------------------------------------------- /src/BrowserLink/InspectMode/InspectModeBrowserLink.cs: -------------------------------------------------------------------------------- 1 | using System.Collections.Generic; 2 | using System.ComponentModel.Composition; 3 | using System.Diagnostics.CodeAnalysis; 4 | using System.IO; 5 | using Microsoft.VisualStudio.Web.BrowserLink; 6 | 7 | namespace BrowserLinkInspector 8 | { 9 | [Export(typeof(IBrowserLinkExtensionFactory))] 10 | public class InspectModeFactory : IBrowserLinkExtensionFactory 11 | { 12 | public BrowserLinkExtension CreateExtensionInstance(BrowserLinkConnection connection) 13 | { 14 | return new InspectMode(); 15 | } 16 | 17 | public string GetScript() 18 | { 19 | using (Stream stream = GetType().Assembly.GetManifestResourceStream("BrowserLinkInspector.BrowserLink.InspectMode.InspectModeBrowserLink.js")) 20 | using (StreamReader reader = new StreamReader(stream)) 21 | { 22 | return reader.ReadToEnd(); 23 | } 24 | } 25 | } 26 | 27 | public class InspectMode : BrowserLinkExtension 28 | { 29 | private BrowserLinkConnection _connection; 30 | private static InspectMode _instance; 31 | 32 | public override void OnConnected(BrowserLinkConnection connection) 33 | { 34 | _connection = connection; 35 | 36 | DisableInspectMode(); 37 | } 38 | 39 | public override void OnDisconnecting(BrowserLinkConnection connection) 40 | { 41 | DisableInspectMode(); 42 | } 43 | 44 | public override IEnumerable Actions 45 | { 46 | get 47 | { 48 | yield return new BrowserLinkAction("Inspect Mode", InitiateInspectMode); 49 | } 50 | } 51 | 52 | private void InitiateInspectMode(BrowserLinkAction ction) 53 | { 54 | Browsers.Client(_connection).Invoke("setInspectMode", true); 55 | 56 | _instance = this; 57 | } 58 | 59 | public static void Select(string sourcePath, int position) 60 | { 61 | if (IsInspectModeEnabled) 62 | { 63 | _instance.Browsers.Client(_instance._connection).Invoke("select", sourcePath, position); 64 | } 65 | } 66 | 67 | public static bool IsInspectModeEnabled 68 | { 69 | get { return _instance != null; } 70 | } 71 | 72 | 73 | [SuppressMessage("Microsoft.Performance", "CA1822:MarkMembersAsStatic")] 74 | [BrowserLinkCallback] 75 | public void SetInspectMode() 76 | { 77 | _instance = this; 78 | } 79 | 80 | [SuppressMessage("Microsoft.Performance", "CA1822:MarkMembersAsStatic")] 81 | [BrowserLinkCallback] 82 | public void DisableInspectMode() 83 | { 84 | _instance = null; 85 | } 86 | } 87 | } -------------------------------------------------------------------------------- /src/BrowserLink/InspectMode/InspectModeBrowserLink.js: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | 4 | (function (browserLink, $) { 5 | /// 6 | /// 7 | 8 | var inspectModeOn = false; 9 | var inspectOverlay = null; 10 | var current; 11 | 12 | function getInspectOverlay() { 13 | if (inspectOverlay === null) { 14 | 15 | $("body").append("