How do I make Visual Studio display "auto" types

Question

So, when I use auto keyword in VS2015 with something simple, like this:

As you can see, it shows the variable's type, but, when I try something a bit more complex (or defined in another file?), it freaks out and gives me some not-so-useful information:

Although VS is still able to determine top's type:

So, I wonder if there is a way to make this wonderful IDE show those complex/defined somewhere else types?

Answer 1

At our company, we use the Visual Assist extension (not free unfortunately, but understandably). It can find the class for the auto keyword when you choose "Goto implementation" (Alt+G).

Answer 2

vs2022 now supports pressing ctrl twice to display the actual type represented by auto. I don't know what you mean by complex/defined somewhere else types, so I can't test it. Hope this helps.

Answer 3

I can't reproduce the error you get. Click Run code snippet below.

<script src="https://unpkg.com/@babel/standalone@7/babel.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script>
<script src="https://unpkg.com/[email protected]/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/redux.js"></script>
<script src="https://unpkg.com/[email protected]/dist/react-redux.js"></script>
<script src="https://unpkg.com/@reduxjs/[email protected]"></script>
<script src="https://unpkg.com/[email protected]/dist/react-bootstrap.js"></script>
<div id="root"></div>

<script type="text/babel">
const { createSlice, createAsyncThunk } = RTK;

// ================================================================
// ================================================================

const getPosts = createAsyncThunk ("posts/getPosts" , 
async (dispatch , getState) => {
    return await fetch('https://jsonplaceholder.typicode.com/posts')
.then(res => res.json())


}
)

 const addPostSlice = createSlice({
    name:'add',
    initialState:{
        posts:[],
        status:false
    },
        
    
    reducers: {},
    extraReducers: {
        [getPosts.pending]:(state ) => {
            state.status = "loading"
        },
        [getPosts.fulfilled]:(state , action) => {
            state.status ="success",
            state.posts = action.payload
        },
        [getPosts.rejected]:(state ) => {
            state.status = "failed"
            
        },
    }



    },
    
 )

const  { reducer} = addPostSlice

// ================================================================
// ================================================================

const { useEffect } = React;
const { Table } = ReactBootstrap;
const { createStore } = Redux;
const { Provider, connect } = ReactRedux;
const { configureStore } = RTK;

const store = configureStore({
  reducer:{
    addPosts: reducer
  }
});


const mapStateToProps = (state, ownProps) => ({
  posts: state.addPosts.posts
});

const mapDispatchToProps = (dispatch) => {
  return {
    getPosts: () => dispatch(getPosts())
  };
};

const connectToStore = connect(mapStateToProps, mapDispatchToProps);

const Posts = connectToStore((props) => {
  const { posts, getPosts } = props;

  useEffect(() => {
    getPosts();
  }, []);

  return (
    <Table striped bordered hover>
      <thead>
        <tr>
          <th>#</th>
          <th>Title</th>
          <th>Body</th>
          <th>UserId</th>
        </tr>
      </thead>
      <tbody>
        {posts.map((p) => (
          <tr key={p.id}>
            <td>{p.id}</td>
            <td>{p.title}</td>
            <td>{p.body}</td>
            <td>{p.userId}</td>
          </tr>
        ))}
      </tbody>
    </Table>
  );
});

const CounterControl = (props) => {
  return (
    <div>
      <button className="btn btn-success" onClick={props.inc}>
        +
      </button>
      <button className="btn btn-danger" onClick={props.dec}>
        -
      </button>
    </div>
  );
};

const StoreProvider = (props) => {
  return <Provider store={store}>{props.children}</Provider>;
};

const App = () => {
  return (
    <StoreProvider>
      <Posts />
    </StoreProvider>
  );
};

ReactDOM.render(<App />, document.getElementById("root"));
</script>