I've specifically set ReSharper to the code style I want, and in C# it does exactly what I ask. But I'm working on an Angular page, and in the controller.js file, when I copy/paste, or complete a statement (with a ; or a } ), ReSharper (and I've disabled it and reenabled it to make sure it was ReSharper) is taking this:
and making it into this:
Note the amount of space. It's auto-formatting an extra line between every thing in the code.
But in my settings, I don't have anything set to tell it to do that:
I'm at a loss as to how to proceed. I absolutely love the formatting I get in C# with it (much better control than VS15 has built in), but this JS stuff is going to cause a mental collapse. And what's stranger: This only started a few days ago. (Nope - nothing new installed in that time!)
Related
Forgive me if this is a really stupid question, but I haven't found any answers yet - or maybe I don't know the correct thing to ask for.
Given the following files that are part of the same project:
MyProject.html
MyProject.css
MyProject.js
(and a MyProject.py that runs on the server to make things happen)
. . . where all three of these items are related and are actually part of a single project and they need to integrate together.
The "html" part of VS code makes sure the html is correct.
The "css" part of VS code makes sure the css is correct.
the JavaScript part of VS code makes sure the javascript is correct.
However, they may not be correct together as a unified whole - I may have changed something in the javascript that references something in the html that may not yet exist - because I forgot to write it, and I don't discover this until I launch things and watch the web-page go all pear-shaped in ways I've never heard of before.
Is there something that will take all these pieces and say "Hey! You changed the definition of this element here in the Javascript but not in the HTML (or the CSS or whatever)
In other words, not only do I want to know if the individual files are syntactically correct, but do they agree with each other?
If there is a "something" that does this, what is it called?
That tool will never exist and for good reasons, it'd slow the living hell out of your computer when programming and wouldn't fair well as a best practice. Though it's cool, it's cooler to write code effectively and not have a slow code editor. So to that suggestion is write your JavaScript and HTML together hand in hand; split view and you won't ever have an issue. CSS can come into play any time.
Your best option for knowing if code is correct, would be a linter but that won't help you with the issues you face if you're calling elements that don't exist or did you'll want to improve how you code these functions/events.
As requested submitted as an answer for the OP.
I use the library bignumber.js, which does the job of handling big/small numbers very nicely. However, debugging with VS Code is a pain, as i get the following output upon inspection:
Is there a way for me to edit this? I've looked into prototype editing but I could not get this to work.
I have two programs that should be running the same . They are not. I'd like to see where their execution diverges. Is there an option in Chrome or Firefox or Safari to log/echo every line of JavaScript as it is executed ? Or some other way to do this short of manually adding console.log every few lines? Note: the divergence is 10k or 20k maybe 100k lines deep and ideally I'd want it to print variables similar to the Chrome dev tools.
Then I can just dump the logs and find the divergence
Stepping through the code in the debugger is not a solution as it would take hours if not days to step that far.
One idea is to use a babel or uglify plugin to use the last to emit code for each line to print what it is about to do or just did.
Another idea is if there is a way to dump all of memory from js so I can compare all objects and all references. They should be the same so when I see two dumps that differ I'll have found my bug. note: JSON.stringify is not an option as I need to see all variables/objects/classes etc.
Note: I'm not looking for basic answers like "use console.log" or "step in the debugger". I appreciate the help and maybe I've overlooked something simple but I do have quite a bit of JavaScript experience.
Maybe an example would help. Imagine you got the source to an app as large as google docs. You run some processor over it that's not supposed to break anything or change anything. Except it does. You look at the changes and can't see anything wrong. All you know is when you run it it runs but a few things are subtly broken. So you put a breakpoint there and see the data is bad. But when did it go bad? You don't know the code (you just got it). It could have been 100s of thousands of lines before. You have no idea where to put breakpoints or console.logs. It could take weeks. But, given you know the code should run exactly the same if you could print all lines of execution you'd find the bug in minutes instead of days.
You can add debugger; at the begin of the function() or where you want and open the console.
When the debugger is reached it stop the execution. After that you can execute code step by step and add some watches.
It works fine with all recent browser.
Example :
function test()
{
var rand = Math.random();
debugger;
return rand;
}
test();
It is node js but it may be helpful for you. set the NODE_V8_COVERAGE environment variable to a directory, coverage data will be output to that directory when the program exits.
https://blog.npmjs.org/post/178487845610/rethinking-javascript-test-coverage
I am trying to build a puzzle game using HTML & JS. This is going to be a standalone HTML page. There isn't going to be a server side for this application.
Obviously, the game has an answer which the application will create at start time. Now, I wish to make this variable completely hidden i.e., not just hidden from user's view but also inaccessible to the user, even if he tries to read the page through Chrome's Developer Tools or such debug tools.
I'm looking for a solution using HTML5, JS ECMAScript 5+ & jQuery.
I remember reading something about Native HTML code (used for HTML File elements) which cannot be rendered/read even through Dev Tools. Is this any help?
Is there any way or strategy to achieve this?
NOTE: I am aware of <input type="hidden">. But that doesn't serve my purpose.
EDIT: As part of the game, the user makes attempts and the application needs to validate the user's input against this somehow-user-hidden answer variable. At this point, I believe there is no solution that's going to be completely airtight in the given constraints. Hence, I'm pursuing this from an academic interest. Does anyone have any other answers ?
Prehash your answer, hard code that into your page.
Then, when they submit their answer, run through whatever hashing pattern you did before hand, and compare the result.
It could theoretically be brute forced, of course.... if you had a few hundred years.
Javascript implementations of:
SHA-1: http://www.webtoolkit.info/javascript-sha1.html
SHA-256: http://www.webtoolkit.info/javascript-sha256.html
MD5: http://www.webtoolkit.info/javascript-md5.html
Edit:
An example would be:
Pattern: SHA-1(SHA-1(SHA-1(answer + salt)))
Salt: 982qx17wef7ddsbtxaewnsdufs (make something up, load it as an input type='hidden')
Result: (load it as an input type='hidden')
Request the answer
If SHA-1(SHA-1(SHA-1(attempt + salt))) === Result, they got it correct
Your can hash your values using MD5.
https://github.com/blueimp/JavaScript-MD5#client-side
This is a NEAR duplicate of this post which has a very nice example of ember-validations (without EAK) here. However, I am wondering if anybody can do an EAK version of this for me, with the one difference that the JSBIN has validation errors shown only once the user has blurred a form input. This jsbin shows the errors on load. I would expect to see the validation messages come after the field has been focused for the first time at the very soonest, rather than onload. Im not sure if this is an artifact of JSBIN implementation or the actual expected feature design of ember-validations. I would love to see a clean EAK in git or bitbucket that has just this, the same 5 or 6 inputs in the index.hbs that are tied to a controller with the same five elements in the validations object, but the difference that it doesn't show errors until after the controls are at least interacted with once by the user. I would be extra happy to see the steps the user took at the terminal to add ember-validations to their EAK, because currently, I'm following this study below and I am unsure if perhaps the problem is not the EAK implementation, but rather the manner in which I've brought the ember-validations.js into my app in the first place. I've had some conflicting suggestions on how this should be done, but considering that right now, I have at least seen error messages in the page it's hard to tell if there's a problem with the way the script is included or not.
gem install bundler
git clone git://github.com/dockyard/ember-validations.git
cd ember-validations
bundle install
bundle exec rake dist
cp dist/ember-validations/ember-validations.js vendor/ember-validations/ember-validations.js
subl app/index.html
insert line 57: <script src="/vendor/ember-validations/ember-validations.js"></script>
open http://localhost:8000
With this, I am able to see the errors highlighted when the app loads. However, for my attempt, I don't see the errors clear or the continue button enabled after satisfactory input is added. So I am having the same unwanted functionality as the JSBIN and the OP. This maybe a more basic ember js question, or a basic EAK question, but I would love to see a simple ember-validations set up in EAK(ES6) format. With a list of files, their locations, or better still a git to clone.
Also, I am looking to see this done without FIXTURES or DS store if possible. I am thinking a simple object in the controller. It appears to me in the documentation that as soon as the object is created, validation fires. So, how to defer the validation until after the form-controls are interacted with?
Thanks!
Edit: So, I was able to get the EAK architecture to happen... anybody interested in my solution, there's a bitbucket repo now for you to inspect and enjoy!
Edit 2: So, looking and thinking about this some more. It makes sense the way it is. It's only my styling and message language that makes it clunky. Of course the presence: property makes them seem like errors, but they are in fact, also hypostatized as cta's or call to actions, highlighting fields that need attention. When the fields are empty initially, instead of thinking about them like errors, think about them like attention getting call outs. Since my button is disabled as long as the fields are inValid, there's no reason to have the messages at any other time, since there will never be a use case in which the user has submitted the button without satisfying the presence and other properties of the validations object. So, to solve my "problem" I just need to think about the errors differently. Instead of styling them with an error class, I'll style them normally, and when presence is satisfied, show a checkmark or something friendly like that. So in effect, these validations are working as I want them to. It's just a matter of not following the out-of-the-box nature of the message error styling.
Double Thanks!